[{"data":1,"prerenderedAt":339},["ShallowReactive",2],{"$ft6jtkd6xhw3c":3,"$f37wsseaxqrh48":263},{"featured":4,"latest":129,"categories":227},[5,14,27,37,48,56,66,76,86,96,106,114,122],{"slug":6,"title":7,"date":8,"excerpt":9,"image":10,"categories":11},"custom-database-tables","Custom DataBase Tables","2015-11-24T02:29:34","You can create the new own table freely in the your WordPress database via this plugin. Then, you can make the management of table or (as view or entry or edit) data in a simple user interface.\\nAlso,","\u002Fassets\u002Fuploads\u002F2016\u002F02\u002Fcdbt-overview.png",[12],{"slug":13,"name":7},"cdbt",{"slug":15,"title":16,"date":17,"excerpt":18,"image":19,"categories":20},"10_php_tips_for_developers","PHP開発者が心得ておくべき10の鉄則","2016-01-11T18:38:09","PHPだけに限った話ではないが、プログラミングを行うに当たって、心得て、準備しておくと失敗が劇的に減る事柄をまとめてある良い記事を見つけたので、私なりの解釈で意訳しつつ、経験則を踏まえてあらためてまとめてみた。 オリジナ…","\u002Fassets\u002Fuploads\u002F2016\u002F01\u002Feyecatch-php-10-tips.jpg",[21,24],{"slug":22,"name":23},"column","コラム",{"slug":25,"name":26},"development","開発関連",{"slug":28,"title":29,"date":30,"excerpt":31,"image":32,"categories":33},"jquery-timeline-v1","2種類の横型タイムラインを簡単に作成できる「jQuery.Timeline」をリリース","2017-05-29T14:55:46","現在開発しているサービスで利用するべく、横型タイムラインを生成できるjQueryプラグインを自作したので、そこだけ単独でリリースしてみた。 ソースコード等はGitHubの方にリリースしてあるので、興味のある方は、そち…","\u002Fassets\u002Fuploads\u002F2017\u002F05\u002Fjquery_timeline_image.png",[34],{"slug":35,"name":36},"jqtl","jQuery.Timeline",{"slug":38,"title":39,"date":40,"excerpt":41,"image":42,"categories":43},"optimize-browser-cache-of-static-resources","更新されたJS、CSS、画像のみブラウザキャッシュを破棄して読み込ませる","2018-01-31T15:47:47","WEBサービスの保守や開発をやっていると、JavaScriptやスタイルシート、画像などの静的リソースを更新した際、しばしば「確認したけど、更新されてないよ」とか云われて、「ブラウザのキャッシュを消してからもう一度見て…",null,[44,47],{"slug":45,"name":46},"codes","コード集",{"slug":25,"name":26},{"slug":49,"title":50,"date":51,"excerpt":52,"image":53,"categories":54},"jquery-timeline","jQuery.Timeline version2 – full documentation","2019-03-04T20:40:48","Plugin Overview The jQuery.Timeline plugin provides you two types of the horizontal timeline. You can create a…","\u002Fassets\u002Fuploads\u002F2019\u002F03\u002Fjquery.timeline_v2.jpg",[55],{"slug":35,"name":36},{"slug":57,"title":58,"date":59,"excerpt":60,"image":61,"categories":62},"released-the-sloth","Released the Sloth of mobile-first CSS micro framework!","2019-04-16T18:04:25","I released the “Sloth” that is mobile-first CSS micro framework. I have long used frontend framewo…","\u002Fassets\u002Fuploads\u002F2019\u002F04\u002Fsloth_doc_head.png",[63],{"slug":64,"name":65},"sloth","Sloth",{"slug":67,"title":68,"date":69,"excerpt":70,"image":71,"categories":72},"challenge-to-conceal-the-wordpress-site","WordPressサイトを徹底的に秘匿化する","2020-02-02T23:59:58","私は自分の個人サイトをはじめ、仕事でもWordPressサイトを運用している。WordPressは気軽にサイトを立ち上げられてカスタマイズも簡単な、素晴らしいオープンソースなのだが、世界中で使われまくっているその知名度…","\u002Fassets\u002Fuploads\u002F2020\u002F02\u002Fshutterstock_1878005929.jpg",[73],{"slug":74,"name":75},"wordpress","WordPress関連",{"slug":77,"title":78,"date":79,"excerpt":80,"image":81,"categories":82},"what-is-forkor","Made a shortened URL app called Forkor","2020-07-07T22:27:01","What’s Forkor? Forkor is a service that provides a shortened URL feature that allows you to redirect any…","\u002Fassets\u002Fuploads\u002F2020\u002F07\u002Fforkor.png",[83],{"slug":84,"name":85},"forkor","Forkor",{"slug":87,"title":88,"date":89,"excerpt":90,"image":91,"categories":92},"manual-about-svg-japan","インタラクティブな日本地図を生成するJSプラグイン「SVG Japan」","2020-11-16T21:19:58","各都道府県をそれぞれ選択・クリック可能なインタラクティブな日本地図を生成するネイティブJavaScript建てのプラグイン「SVG Japan」を作ったので、その紹介と使い方をまとめておく。ちなみにソースコードはgit…","\u002Fassets\u002Fuploads\u002F2020\u002F11\u002Fsvg-japan.png",[93],{"slug":94,"name":95},"svg-japan","SVG Japan",{"slug":97,"title":98,"date":99,"excerpt":100,"image":101,"categories":102},"wp-ignitor-plugin-to-conceal-wordpress-site","WordPressサイトを秘匿化するプラグイン「WP Ignitor」","2021-01-19T15:28:21","以前「WordPressサイトを徹底的に秘匿化する」という記事で、WordPress建てのサイトを秘匿化する方法を取り上げたのだが、あれをサイト構築時に毎度実施するとなるととても労力が必要であった。そこで、もっとお手軽…","\u002Fassets\u002Fuploads\u002F2021\u002F01\u002Fbanner-1554x500-1.png",[103],{"slug":104,"name":105},"wp-ignitor","WPイグナイタ",{"slug":107,"title":108,"date":109,"excerpt":110,"image":111,"categories":112},"tastewp","無料でWordPressサイトを複数作成できるWEBサービス「TasteWP」","2021-03-25T20:21:59","私が日本語翻訳に協力しているWEBサービス「TasteWP」について紹介しようと思う。 https:\u002F\u002Ftastewp.com このサービス、サインアップすることなく無料で自分用のWordPressサイトを作れるとい…","\u002Fassets\u002Fuploads\u002F2021\u002F03\u002FTasteWP_screenshot.png",[113],{"slug":74,"name":75},{"slug":115,"title":116,"date":117,"excerpt":118,"image":119,"categories":120},"monster-hunter-rise-skill-simulator","モンハンライズのスキルシミュレータを作ってみた！","2021-06-28T20:24:52","コラムで連載していたNintendo Switch版『モンスターハンターライズ』のスキルシミュレータ開発がやっと一段落して一通り完了した。いやぁ、記事書きながら同時並行で開発すると思っていた以上に時間がかかるもんだなぁ…","\u002Fassets\u002Fuploads\u002F2021\u002F06\u002Fmhrss_v100.png",[121],{"slug":25,"name":26},{"slug":123,"title":124,"date":125,"excerpt":126,"image":42,"categories":127},"comparison-of-javascript-date-libraries","JavaScriptの日時ライブラリを比較してみた","2021-07-28T22:39:19","ネイティブJavaScriptで日時を取り扱う場合、ビルトインされているDateオブジェクトを使うことになるのだが、このDateオブジェクトは取り扱いにクセが多く、直感的に日時を操作できない点でも有名である。そこで、専…",[128],{"slug":25,"name":26},[130,141,153,165,175,184,192,195,198,206,213,220],{"slug":131,"title":132,"date":133,"excerpt":134,"image":135,"categories":136},"pulllog_launched","ガチャ履歴を記録・分析できるWebサービス「PullLog」","2025-08-22T13:05:30","このたび、新しい個人開発サービスとして 「PullLog（プルログ）」 をリリースした。 URLはこちら https:\u002F\u002Fpulllog.net PullLogとは？ PullLogは、ソーシャルゲームのガチャ履歴を記録…","\u002Fassets\u002Fuploads\u002F2025\u002F08\u002Fpulllog_stats_jp.png",[137,140],{"slug":138,"name":139},"industries","プロダクト",{"slug":25,"name":26},{"slug":142,"title":143,"date":144,"excerpt":145,"image":146,"categories":147},"mockapi-php-openapi-schema-generation","モックAPIのレスポンスから OpenAPI 3.0 スキーマを自動生成するPHPツール","2025-04-17T09:31:52","私自身がそうなのですが、OpenAPI仕様書を毎回手作業で書いていて「面倒だな」と思ったことはありませんか？ そんな（私と）あなたにぴったりのツールがあります。 レスポンスの例さえ用意すれば、OpenAPI 3.0 スキ…","\u002Fassets\u002Fuploads\u002F2025\u002F04\u002Fswaggerui-preview.png",[148,151,152],{"slug":149,"name":150},"mockapi-php","MockAPI-PHP",{"slug":138,"name":139},{"slug":25,"name":26},{"slug":154,"title":155,"date":156,"excerpt":157,"image":158,"categories":159},"ambient_playlist_customize","Ambientでメメントモリのラメントプレイヤーを作る","2023-11-30T17:32:39","「Ambient」の最新バージョン 1.2.0で実装した「疑似フェーダー」機能を使って、ソーシャルゲーム「メメントモリ」のYouTube公式チャンネルで公開されているMVを集約したラメント専用プレイヤーを作ってみた。 ラ…","\u002Fassets\u002Fuploads\u002F2023\u002F11\u002Fambient_mememori_1.png",[160,163,164],{"slug":161,"name":162},"ambient","Ambient",{"slug":138,"name":139},{"slug":25,"name":26},{"slug":166,"title":167,"date":168,"excerpt":169,"image":170,"categories":171},"released_ambient_demo_version","Ambientメディアプレイヤーのクラウド版デモを公開","2023-11-22T13:47:36","つい先日「Ambient」の最新バージョン 1.1.0をリリースして、それに合わせてクラウド版デモサイトも公開してみた。 なお、クラウド版デモでローカルのホストコンピュータのメディアを再生するには、そのメディアファイルも…","\u002Fassets\u002Fuploads\u002F2023\u002F10\u002FAmbientMediaPlayer-typologo.png",[172,173,174],{"slug":161,"name":162},{"slug":138,"name":139},{"slug":25,"name":26},{"slug":176,"title":177,"date":178,"excerpt":179,"image":170,"categories":180},"ambient-media-player","YouTubeと自分のPC内メディアを同時に再生できるメディアプレイヤーを作ってみた","2023-10-20T00:00:25","私はよくPCで何か作業をするときには音楽を垂れ流していることが多い。 そういう時にかける曲は、手持ちのアルバムCD等からPCに取り込んだ音源だったり、さらにはYouTubeの動画だったりとメディアや再生環境がバラバラだ。…",[181,182,183],{"slug":161,"name":162},{"slug":138,"name":139},{"slug":25,"name":26},{"slug":185,"title":186,"date":187,"excerpt":188,"image":189,"categories":190},"what-is-the-sunorhc","Sunorhc is a date-time library for JavaScript","2021-08-25T22:55:55","Sunorhc is a lightweight library for handling dates and times for JavaScript. The library wraps a native JavaS…","\u002Fassets\u002Fuploads\u002F2021\u002F08\u002Fshutterstock_1091212919_resized.jpg",[191],{"slug":25,"name":26},{"slug":123,"title":124,"date":125,"excerpt":126,"image":42,"categories":193},[194],{"slug":25,"name":26},{"slug":115,"title":116,"date":117,"excerpt":118,"image":119,"categories":196},[197],{"slug":25,"name":26},{"slug":199,"title":200,"date":201,"excerpt":202,"image":203,"categories":204},"mhrise-skill-simulator-creation-chapter-12","モンスターハンターライズのスキルシミュレータを作ってみる！ 第12回","2021-06-21T13:11:46","今回は「マイセット登録」と護石データの「エクスポート／インポート」機能の追加をしていく。折り良く（悪く？）「FF7リメイク・インターグレード」や「FORTNITEシーズン7」が出たこともあって、そっちをプレイしてたらこ…","\u002Fassets\u002Fuploads\u002F2021\u002F04\u002Fb6ca09e9a7f6faf27641f62dabe64c6ff97b4f326aa478379e3c112aa28eb9ab.jpg",[205],{"slug":22,"name":23},{"slug":207,"title":208,"date":209,"excerpt":210,"image":203,"categories":211},"mhrise-skill-simulator-creation-chapter-11","モンスターハンターライズのスキルシミュレータを作ってみる！ 第11回","2021-06-07T14:52:31","さて、今回はユーザー個別データの管理部分を開発していく予定だが、まずその前にやっておくことがある。 新スキル「風雷合一」に対応する Ver.3.0の大型無料アップデートで追加された新スキルに「風雷合一」というのがある…",[212],{"slug":22,"name":23},{"slug":214,"title":215,"date":216,"excerpt":217,"image":203,"categories":218},"mhrise-skill-simulator-creation-chapter-10","モンスターハンターライズのスキルシミュレータを作ってみる！ 第10回","2021-06-02T00:29:10","今回は、護石管理画面の作成だ。この護石管理では、ユーザーごとに護石の登録を行う機能と、登録した護石を削除する機能を持つ仕様になる。この画面から登録した護石データはデータベースに格納するので、フロントエンド側からのリクエス…",[219],{"slug":22,"name":23},{"slug":221,"title":222,"date":223,"excerpt":224,"image":203,"categories":225},"mhrise-skill-simulator-creation-chapter-9","モンスターハンターライズのスキルシミュレータを作ってみる！ 第9回","2021-05-22T23:56:27","さて、今回はVuexによるデータ・キャッシュの実装だ。一度データベースから読み込んだデータをフロントエンド側で再利用可能なストアに格納することで、データベースへの接続回数を減らしてシステム負荷を下げるとともに、UX的な…",[226],{"slug":22,"name":23},[228,230,232,236,238,239,240,241,242,244,247,248,250,252,254,258,261],{"slug":161,"name":162,"count":229},3,{"slug":13,"name":7,"count":231},7,{"slug":233,"name":234,"count":235},"csnp","Custom Sticky Notes",2,{"slug":84,"name":85,"count":237},1,{"slug":35,"name":36,"count":229},{"slug":149,"name":150,"count":237},{"slug":64,"name":65,"count":237},{"slug":94,"name":95,"count":237},{"slug":74,"name":75,"count":243},37,{"slug":245,"name":246,"count":237},"wpqt","WP Qiita",{"slug":104,"name":105,"count":237},{"slug":22,"name":23,"count":249},29,{"slug":45,"name":46,"count":251},16,{"slug":138,"name":139,"count":253},5,{"slug":255,"name":256,"count":257},"lifelog","ライフログ",64,{"slug":259,"name":260,"count":235},"uncategorized","未分類",{"slug":25,"name":26,"count":262},45,{"type":264,"post":265},"post",{"slug":266,"title":267,"date":268,"excerpt":269,"image":270,"categories":271,"modified":273,"html":274,"tags":275,"related":293,"prev":323,"next":331},"what-to-do-if-search-results-displaying-nothing-when-using-iframe-in-google-adsense","Google Adsenseで検索結果のiframeが表示されない時の対処法","2016-03-09T18:26:27","Google Adsenseの検索ユニットには検索結果の表示方法が3つあり、iframe を使用して自分のウェブサイトに表示する方法を選択して実装した時に検索結果が表示されないという症状に陥いる場合がある。その時の解決方…","\u002Fassets\u002Fuploads\u002F2016\u002F03\u002Fgoogle-adsense-logo.png",[272],{"slug":45,"name":46},"2021-02-03T20:34:37","\u003Cp>Google Adsenseの検索ユニットには検索結果の表示方法が3つあり、\u003Cstrong>iframe を使用して自分のウェブサイトに表示\u003C\u002Fstrong>する方法を選択して実装した時に検索結果が表示されないという症状に陥いる場合がある。その時の解決方法を備忘録として残しておこう。\u003C\u002Fp>\n\u003Ch2>Googleカスタム検索の結果がiframeに表示されない時\u003C\u002Fh2>\n\u003Cp>まず、検索ユニットを設置したウェブサイトがSSL対応しているかどうかが重要だ。特に、ローカルや開発環境がSSL対応してないけど、本番環境はSSL対応だったりすると、試験してた時は動いていたのに、いざ本番にアップしたら動かない…という事態にもなり易い。\u003C\u002Fp>\n\u003Cp>──というわけで、一番最初に行ってほしいのは、実際にサイト内に設置したGoogle Adsenseの広告コードがSSL対応されているかどうかを確認することだ。もしSSL非対応のサイトでこの症状が起きている場合、おそらくは広告コードの記述ミスが原因だろうと思われる。\u003C\u002Fp>\n\u003Cp>Adsenseの管理画面で発行される検索ユニットの初期コードは下記のようになっている。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>1. 検索ボックス（BEFORE）\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;form action=\"https:\u002F\u002Fwww.example.com\u002Fsearch-results\u002F\" id=\"cse-search-box\"&gt;\n  &lt;div&gt;\n    &lt;input type=\"hidden\" name=\"cx\" value=\"partner-pub-xxxxxxxxxxxxxx:yyyyyyyyyyy\" \u002F&gt;\n    &lt;input type=\"hidden\" name=\"cof\" value=\"FORID:zz\" \u002F&gt;\n    &lt;input type=\"hidden\" name=\"ie\" value=\"UTF-8\" \u002F&gt;\n    &lt;input type=\"text\" name=\"q\" size=\"55\" \u002F&gt;\n    &lt;input type=\"submit\" name=\"sa\" value=\"検索\" \u002F&gt;\n  &lt;\u002Fdiv&gt;\n&lt;\u002Fform&gt;\n\n&lt;script type=\"text\u002Fjavascript\" src=\"http:\u002F\u002Fwww.google.co.jp\u002Fcoop\u002Fcse\u002Fbrand?form=cse-search-box&amp;lang=ja\"&gt;&lt;\u002Fscript&gt;\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cstrong>2. 検索結果（BEFORE）\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;div id=\"cse-search-results\"&gt;&lt;\u002Fdiv&gt;\n&lt;script type=\"text\u002Fjavascript\"&gt;\n  var googleSearchIframeName = \"cse-search-results\";\n  var googleSearchFormName = \"cse-search-box\";\n  var googleSearchFrameWidth = 800;\n  var googleSearchDomain = \"www.google.co.jp\";\n  var googleSearchPath = \"\u002Fcse\";\n&lt;\u002Fscript&gt;\n&lt;script type=\"text\u002Fjavascript\" src=\"http:\u002F\u002Fwww.google.com\u002Fafsonline\u002Fshow_afs_search.js\"&gt;&lt;\u002Fscript&gt;\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>私のサイトのようにSSL対応のサイト（上記の検索ボックスコード中で\u003Ccode>form\u003C\u002Fcode>タグの\u003Ccode>action\u003C\u002Fcode>属性が\u003Ccode>https:\u002F\u002F～\u003C\u002Fcode>となるようなサイト）にこの初期コードを埋め込んでしまうと、\u003Cstrong>Mixed Contents\u003C\u002Fstrong>のスクリプトエラーが発生して検索結果が表示されなくなる。\u003C\u002Fp>\n\u003Cp>つまり、検索結果ページとして指定した\u003Ccode>https:\u002F\u002F～\u003C\u002Fcode>（上記の例だと\u003Ccode>https:\u002F\u002Fwww.example.com\u002Fsearch-results\u002F\u003C\u002Fcode>）に\u003Ccode>http:\u002F\u002Fwww.google.co.jp\u002F～\u003C\u002Fcode>からスクリプトを読み込もうとして「1つのページ内にHTTPとHTTPSのコンテンツが混在しているよ」と怒られるわけだ。\u003C\u002Fp>\n\u003Cp>そこで、\u003Ca href=\"https:\u002F\u002Fsupport.google.com\u002Fadsense\u002Fanswer\u002F10528?hl=ja\">Googleの公式ヘルプ「SSL 対応の AdSense 用広告コード」\u003C\u002Fa>の通りに、広告コードのSSL対応を行ってあげる。上記のBEFOREの例をSSL対応コードに直すと下記のようになる。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>1. 検索ボックス（AFTER）\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;form action=\"https:\u002F\u002Fwww.example.com\u002Fsearch-results\u002F\" id=\"cse-search-box\"&gt;\n  &lt;div&gt;\n    &lt;input type=\"hidden\" name=\"cx\" value=\"partner-pub-xxxxxxxxxxxxxx:yyyyyyyyyyy\" \u002F&gt;\n    &lt;input type=\"hidden\" name=\"cof\" value=\"FORID:zz\" \u002F&gt;\n    &lt;input type=\"hidden\" name=\"ie\" value=\"UTF-8\" \u002F&gt;\n    &lt;input type=\"text\" name=\"q\" size=\"55\" \u002F&gt;\n    &lt;input type=\"submit\" name=\"sa\" value=\"検索\" \u002F&gt;\n  &lt;\u002Fdiv&gt;\n&lt;\u002Fform&gt;\n\n&lt;script type=\"text\u002Fjavascript\" src=\"\u002F\u002Fwww.google.co.jp\u002Fcoop\u002Fcse\u002Fbrand?form=cse-search-box&amp;lang=ja\"&gt;&lt;\u002Fscript&gt;\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cstrong>2. 検索結果（AFTER）\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;div id=\"cse-search-results\"&gt;&lt;\u002Fdiv&gt;\n&lt;script type=\"text\u002Fjavascript\"&gt;\n  var googleSearchIframeName = \"cse-search-results\";\n  var googleSearchFormName = \"cse-search-box\";\n  var googleSearchFrameWidth = 800;\n  var googleSearchDomain = \"www.google.co.jp\";\n  var googleSearchPath = \"\u002Fcse\";\n&lt;\u002Fscript&gt;\n&lt;script type=\"text\u002Fjavascript\" src=\"\u002F\u002Fwww.google.com\u002Fafsonline\u002Fshow_afs_search.js\"&gt;&lt;\u002Fscript&gt;\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>それぞれのスクリプトタグの\u003Ccode>src\u003C\u002Fcode>属性のURLから\u003Ccode>http:\u003C\u002Fcode>の部分を取り除くだけだ。\u003Cbr \u002F>\nこれで、ソースのインクルードを行う際にブラウザが最適なプロトコルを自動で補完してくれるようになる。\u003C\u002Fp>\n\u003Cp>しかし、これだけだと検索結果ページに自動でレンダリングされる\u003Ccode>iframe\u003C\u002Fcode>タグの\u003Ccode>src\u003C\u002Fcode>属性のURLまでは変更されない（最初はブラウザのキャッシュかと思ったが、何度やってもダメだったので、Google Adsenseのバグではないかと思われる）。つまり、検索結果ページには下記のようなHTMLが生成されてしまい、Mixed Contentsエラーで検索結果が表示されないのだ。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;div id=\"cse-search-results\"&gt;\n&lt;iframe name=\"googleSearchFrame\" src=\"http:\u002F\u002Fwww.google.co.jp\u002Fcse?cx=partner-pub-xxxxxxxxxxxxxx%3Ayyyyyyyyyyy&amp;cof=FORID%3Azz&amp;ie=UTF-8&amp;q=keyword&amp;sa=%E6%A4%9C%E7%B4%A2&amp;siteurl=www.example.com%2F&amp;ref=www.example.com%2Fsearch-unit%2F&amp;ss=527j94689j4&amp;ad=n9&amp;num=10&amp;rurl=https%3A%2F%2Fwww.example.com%2Fsearch-results%2F%3Fcx%3Dpartner-pub-xxxxxxxxxxxxxx%253Ayyyyyyyyyyy%26cof%3DFORID%253Azz%26ie%3DUTF-8%26q%3Dkeyword%26sa%3D%25E6%25A4%259C%25E7%25B4%25A2%26siteurl%3Dwww.example.com%252F%26ref%3Dwww.example.com%252Fsearch-unit%252F%26ss%3D527j94689j4\" frameborder=\"0\" width=\"800\" height=\"1860\" marginwidth=\"0\" marginheight=\"0\" hspace=\"0\" vspace=\"0\" allowtransparency=\"true\" scrolling=\"no\"&gt;&lt;\u002Fiframe&gt;\n(以下略)\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>──であれば、自動でレンダリングされる\u003Ccode>iframe\u003C\u002Fcode>の\u003Ccode>src\u003C\u002Fcode>属性をウェブ側から修正してあげれば良い。サイト側のJavaScriptに下記のスクリプトを追加してみた（下記の例ではjQuery使っている）。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>if ( $('#cse-search-results').size() &gt; 0 ) {\n  if ( $('iframe[name=\"googleSearchFrame\"]').size() &gt; 0 ) {\n    var ifsr = $('iframe[name=\"googleSearchFrame\"]');\n    var loadSrc = ifsr.attr('src');\n    ifsr.attr('src', loadSrc.replace( 'http:', '' ));\n  }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Google Adsenseが自動生成する\u003Ccode>iframe\u003C\u002Fcode>の\u003Ccode>src\u003C\u002Fcode>属性のURLに\u003Ccode>http:\u003C\u002Fcode>の記述があったら削除するという処理だ。SSL非対応のHTTPプロトコルではHTTPSコンテンツが混在していてもMixed Contentsエラーは起きないので\u003Ccode>http:\u003C\u002Fcode>固定処理で構わない。\u003C\u002Fp>\n\u003Cp>これで、SSL対応サイト内にもGoogle Adsenseの検索ユニットで検索結果が表示されるようになった（少々強引だが…）。\u003C\u002Fp>\n\u003Cp>この強引な対応だけだと、ページの初回読み込み時にはMixed Contentsエラーが起きてしまうのは防げない。まぁ、大元のGoogle Adsenseでそのうち対応されると思うのでそれまでの暫定的な対処だ。ただ、もしGoogle Adsense側で対応された後でもこの暫定対処スクリプトはそのまま残しておけるので、一度対応しておけば放置していても構わない（ハズだ）。\u003C\u002Fp>\n\u003Ch2>おまけ\u003C\u002Fh2>\n\u003Cp>ついでに、Google Adsenseの検索ユニットの検索結果の表示領域（横幅）をレスポンシブ対応させるやり方を紹介しておこう。Google Adsenseで検索結果を「iframe を使用して自分のウェブサイトに表示」にすると横幅が指定できるのだが、固定値での指定になってしまい扱いづらい。\u003Cbr \u002F>\nそこで、サイト側のJavaScript（jQuery）で表示域をレスポンシブ化するのだ。\u003C\u002Fp>\n\u003Cp>まず、検索結果表示用の検索コードを下記のように変更する。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&lt;div id=\"cse-search-results\"&gt;&lt;\u002Fdiv&gt;\n&lt;script type=\"text\u002Fjavascript\"&gt;\n  var googleSearchIframeName = \"cse-search-results\";\n  var googleSearchFormName = \"cse-search-box\";\n  var googleSearchFrameWidth = $('#cse-search-results').width();\n  var googleSearchDomain = \"www.google.co.jp\";\n  var googleSearchPath = \"\u002Fcse\";\n&lt;\u002Fscript&gt;\n&lt;script type=\"text\u002Fjavascript\" src=\"\u002F\u002Fwww.google.com\u002Fafsonline\u002Fshow_afs_search.js\"&gt;&lt;\u002Fscript&gt;\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>次に、サイト側のJavaScript（jQuery）に下記を追加する。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>var adjustAdsenseSearchResults = function(){\n  if ( $('#cse-search-results').size() &gt; 0 ) {\n    if ( $('iframe[name=\"googleSearchFrame\"]').size() &gt; 0 ) {\n      var ifsr = $('iframe[name=\"googleSearchFrame\"]');\n      ifsr.attr('src', loadSrc.replace( 'http:', '' )).attr( 'width', $('#cse-search-results').width() ).css({ width: $('#cse-search-results').width() + 'px' });\n    }\n  }\n};\n$(window).on('load resize', function(){\n  adjustAdsenseSearchResults();\n});\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>これで、ページが読み込まれたりリサイズされた時に検索結果の\u003Ccode>iframe\u003C\u002Fcode>の横幅が調整されるようになる。\u003C\u002Fp>\n\u003Cp>\u003Cdiv class=\"clearfix\" style=\"margin-bottom: 3em;\">\u003C\u002Fdiv>\u003C\u002Fp>\n\u003Cp>一般的にサイト内検索は、パフォーマンス的にもマネタイズ的にもGoogle Adsenseの検索ユニットを利用した方がメリットが多い。もしあなたのサイトのサイト内検索が自前のスクリプトに依存しているのであれば、Google Adsenseの検索ユニットへの変更を検討してみてはどうだろうか。\u003C\u002Fp>\n",[276,279,281,284,287,290],{"slug":277,"name":278},"google-adsense","Google Adsense",{"slug":280,"name":280},"iframe",{"slug":282,"name":283},"javascript","JavaScript",{"slug":285,"name":286},"jquery","jQuery",{"slug":288,"name":289},"ssl","SSL",{"slug":291,"name":292},"%e6%a4%9c%e7%b4%a2%e7%b5%90%e6%9e%9c","検索結果",[294,302,306,315],{"slug":295,"title":296,"date":297,"excerpt":298,"image":42,"categories":299},"switch-the-read-or-unread-posts-of-wordpress","WordPressの記事の既読・未読を判定する","2014-07-23T20:11:59","WordPressの単一投稿ページや固定ページでは、\u003CBODY>タグのクラスに投稿IDが出力されます。 単一投稿ページでは、class=”single single-post postid-13 single…",[300,301],{"slug":74,"name":75},{"slug":45,"name":46},{"slug":38,"title":39,"date":40,"excerpt":41,"image":42,"categories":303},[304,305],{"slug":45,"name":46},{"slug":25,"name":26},{"slug":307,"title":308,"date":309,"excerpt":310,"image":311,"categories":312},"javascript-function-that-can-determine-whether-specific-value-is-empty","JavaScriptでPHPのempty()のように空判定ができる関数","2017-10-13T20:18:47","JavaScriptにはオブジェクトや配列などの引数に与えた変数（値）が「空」かどうかを判定する関数がない。つまり、PHPで云うところの empty() や、Railsで云うところの blank? といったビルトインメ…","\u002Fassets\u002Fuploads\u002F2016\u002F06\u002Ftools.png",[313,314],{"slug":45,"name":46},{"slug":25,"name":26},{"slug":316,"title":317,"date":318,"excerpt":319,"image":311,"categories":320},"ready-to-usable-the-7-javascript-utility-functions","JavaScriptのすぐ使える7つのユーティリティ関数","2016-06-02T15:05:03","私が「Custom DataBase Tables」プラグインのJavaScriptで使っている関数で、すぐに使えて、わざわざ外部ライブラリを読み込むまでもないユーティリティ関数がいくつかあるので、それらを紹介してみたい…",[321,322],{"slug":45,"name":46},{"slug":25,"name":26},{"slug":324,"title":325,"date":326,"excerpt":327,"image":328,"categories":329},"do-unit-test-of-wordpress-plugin-using-wp-cli-and-phpunit-in-xampp-environment","XAMPP環境でwp-cliとphpunitを使ってWordPressプラグインのテストを行う","2016-03-04T19:10:48","以前に書いた「XAMPP環境でphpunitをインストールしてユニットテストを実行する」の記事の続編である。 いやはや…最近、公開しているプラグインの機能が増えて来たこともあってか、ビルドバージョンのアップだけなのに、作…","\u002Fassets\u002Fuploads\u002F2016\u002F03\u002Fshutterstock_218803594_resized.jpg",[330],{"slug":74,"name":75},{"slug":332,"title":333,"date":334,"excerpt":335,"image":336,"categories":337},"build-development-environment-of-xampp-with-git-and-svn-and-node-js-on-windows10","Windows10にXAMPP+Git+SVN+Node.jsの開発環境を構築する","2016-03-23T01:18:24","今年に入ってから、私のメインPCであるデスクトップPC（DELL XPS8300）のHDDから異音がするようになった。さらにここ数週間前からは、PC起動直後のチェックディスクでもエラーが出るようにもなったので、いよいよ寿…","\u002Fassets\u002Fuploads\u002F2016\u002F03\u002Fwindows10.jpg",[338],{"slug":25,"name":26},1793391397842]