サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
アメリカ大統領選
open-cage.com
WordPress5.5からブロックエディタに追加された機能として「ブロックパターン」があります。 ブロックエディタでは、複数のブロックを組み合わせてページを作成しますが、ブロックパターンを使うことで、簡単に、効率よくコンテンツを構築することができます。
現在のOPENCAGEテーマには、head内にコードを自動挿入できるオプションが実装されています。 STORK19の場合は、管理画面の【外観 > カスタマイズ > アクセス解析コード・headタグ > head / bodyタグ】の入力欄にコードを貼り付けることで、head内に挿入できるようになっています。 ブログをやっているとよく遭遇するカスタマイズで、広告の設置の際に<head>内に特性のコードを記載するように求められることがあります。 アクセス解析コードの設置や、アフィリエイトタグ、AdSenseの審査コード・自動広告コードなどなど。 例えばAdSenseの審査コードの設置の場合、「http://xxxx.com のHTMLでタグを探し、その直後に貼り付けてください。」といった具合にです。 いろいろなブログ記事で見かける解決方法 headタグの中にコードを挿入することを実現するために
究極のモバイルファースト オールインワンWPテーマ WordPressテーマ「STORK19（ストーク19 ）」ver.5.0 STORK19（ストーク19）は、累計4万人以上のユーザーに使われている「STORKシリーズ」のテーマです。 従来のSTORKの洗練されたデザインをそのままに、機能面の強化と表示スピードの改善が成されており、これらは日々のアップデートでも進化を続けています。
リンクをコピー WordPressにてトップページは問題無く表示されるけど、トップページ以外のページが表示されずに、404エラーとなってしまう場合があります。 主な発生条件としてはこんな感じ。 WordPressを引っ越しした（テスト環境から本番環境に移したなど） パーマリンクを変更した .htaccessファイルを変更した時 上記以外にも原因となることもあるかもしれませんが、ひとまず多いのはこのあたりです。 トップページ以外が全く表示されず焦ってしまって、色んな所をいじくり回して後戻りできなくなる。。。なんてことにならないように、まずは下で書いた項目を確認してみてください。 パーマリンク設定を更新する まず最初に疑うべき内容はこれ。「パーマリンク」です。 管理画面の【設定 > パーマリンク設定】のページを開き、何も変更せずに「変更を保存」ボタンを押します。 これによりURL関連の設定が再
いさぎよく、シンプル。 洗練されたWPテーマ ブロガー専用テーマ「SWALLOWスワロー」 SWALLOWはシンプルな見た目と洗練された機能美が光るWordPressテーマです。 プロブロガー八木仁平監修のもと、OPENCAGEが開発したWordPressテーマ。「必要なものとは何か」を考え尽くして、無駄な機能やデザインを削ぎ落とした洗練されたWordPressテーマです。
リンクをコピー 新テーマリリースのお知らせ いつもオープンケージのWordPressテーマをご購入いただきありがとうございます。 本日2018年1月17日、新テーマとなる「SWALLOW」をリリースいたしました。 よろしければご紹介ページがありますので、そちらを御覧くださいませ。
リンクをコピー 記事内にAdSenseの「記事内広告」を設置する方法をご紹介します。 この記事内広告というものは、新しくAdSenseに追加された仕組みなのですが、「記事内に親和性の高い広告を設置する」ということで、これまでのレクタングルなどの広告とはかなり異なります。また、広告のサイズをデバイスに合わせて調整してくれるので1つの広告コードで運用できてしまうのも良い点。 というわけで、AdSenseの管理画面より広告コードを取得して設置するところまでをご紹介したいと思います。 ※先に書いておくと、終盤から記載している「記事内広告を自動的に見出しの直前に表示する方法（functions.phpをカスタム）」の設置方法を利用するのがおすすめです。前半部分では、基本的な使い方の紹介となりますので、実際の設置は後半部分を参照していただいた方が良いかとおもいます。 AdSense側での準備 まずは広
リンクをコピー AdSenseにてインフィード広告が解禁されました。 いくつかお問い合わせをいただきましたので、弊社テーマ（アルバトロス、ハミングバード、ストーク）にてインフィード広告を記事一覧の間に表示させたい場合のカスタマイズ方法をご紹介させていただきます。 今回はサンプルとして、記事一覧の4番目に広告を表示させる方法です。 ▼仕上がりイメージ 補足 今回の記事は、弊社テーマ（アルバトロス、ハミングバード、ストーク）をご利用中の方向けのカスタマイズ記事です。その他のテーマの場合はちょっと手順などが違う場合がありますので、その点はあらかじめご了承ください。 1. インフィード広告用のコードを作成する まずはインフィード広告用のコードを作成しましょう。ここは通常のAdSense広告を取得する方法とほとんどかわりません。 1-1. 新しい広告ユニットを作成 まずはAdSenseのページより「
トップページデザインを3種類からお選びいただけます。 ベーシック 記事一覧が並ぶベーシックなデザインのトップページテンプレートです。特に設定の必要はありません。通常通り記事をアップしていけば新着順に記事が表示されるようになります。記事部分のレイアウト変更に関しては「記事一覧ページの編集方法」を参照してください。 「pickup」というスラッグのついた投稿があると、スライドショーが出現しますので不要な場合は、タグを外すかタグのスラッグ（URL）を変更してください。 スライダー付き記事一覧 記事一覧の上にピックアップ記事のスライドショーを追加することが可能です。スライドショーに記事を入れる方法は、2ステップです。 スライダーの設定方法 ①スライドショー用のタグを作成 【管理画面 > 投稿 > タグ】より「pickup」というスラッグの「タグ」を新規作成します。タグの設定ページに入ったら「新規タ
トップページのデザイン変更 トップページのデザインを3種類からお選びいただけます。ベーシック、スライドショー付き、ヘッダー付きのリッチなトップページからお選びいただけます。 設定方法は全て管理画面からできるので、タグが分からなくても安心です。 トップページの設定について詳しく見る ウィジェット ウィジェットを分類ごとに細かくご用意しておりますので、管理画面からウィジェットを追加していくことで、簡単にサイトをつくり上げることができます。 メインサイドバー、スクロール追従型、各Adsense広告用（PC、モバイル）、トップページ用、CTAなどブログマーケティングに必要なウィジェットが揃っています。 ウィジェットの設定を詳しく見る ヘッダー（PC・スマートフォン）フッターメニュー グローバルナビ（PC）、グローバルナビ（スマートフォン）、フッターメニューの3種類のメニュー設定が可能です。PC版グ
ヘッダーメニューの設定方法をご紹介します。 基本的な設定方法としては【外観 > メニュー】から設定を行います。 PC用グローバルナビの設定 英語表記付きのグローバルナビを管理画面から設定できます。 まず、管理画面の【外観 > メニュー】を開きます。 メニューをつくったことがない場合は、メニューを新規作成し、任意の名前をつけます。（ご自身のわかりやすい名前にすると、後からわかりやすいです。） 追加したいメニューを選んで【メニューに追加】で追加していく。 追加後、ドラッグアンドドロップで並び替え可能です。 メニューを階層化することも可能です。 メニューが出来上がったら【メニュー設定 > グローバルナビ】にチェックをいれて【メニューを保存】で表示するとこが可能です。 ただし、この段階でサイトの表示を確認してみると、英語表記がでていないのが分かるかと思います。 グローバルナビの英語を表示させる方法
リンクをコピー ストークテーマでtableタグを設置した場合、tableの大きさ（中の文字量やカラム数）によってはスマートフォンで見た際にうまくレイアウトされず、はみ出してしまう場合があります。 tableタグは昔からあるタグですが、スマートフォンサイトにはあまり適していない場合がある（見た目の部分で）タグなのですが、スマートフォンで確認した際には、table（表）を横スクロールさせるようにする方法をご紹介します。 ちなみに、STORK19であれば表ブロックにテーブルの横スクロール機能が標準装備されていますので、こちらのカスタマイズは不要です。 CSSを追加する まずは下記CSSを子テーマのstyle.cssなどに追記していただくことで横スクロール型のtableを利用する準備が完了します。 @media only screen and (max-width: 480px) { .tscro
うまく設置できれば、記事下に下記キャプチャのようなCTAが表示されるようになります。 CTAサンプルのスクリーンショット デフォルトのサンプルコード ウィジェットの「テキスト」内に設置するサンプルコードが下記です。画像URLやリンク先URLに置き換えていただくことで設置が可能となっています。 [cta_in] [cta_ttl]ここにキャッチコピーを記入[/cta_ttl] ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述ここに説明文章を記述 [cta_btn link="ここにボタンのリンク先を"]ここにボタン内のテキストを[/cta_btn] [/cta_in] 【応用編】CTA用のショートコードとその他のショートコ
リンクをコピー 弊社テーマ「アルバトロス」「ハミングバード」「ストーク」を使っている方でWordPressプラグインの「AMP」にてAMP対応されている方向けの記事です。 AMPプラグインはブログに簡単にAMPを導入できる反面、SNSボタンなどのパーツが全くついていないのでちょっと味気ない感じになってしまいます。 そこでテーマファイル内のfunctions.phpを少しカスタマイズしてAMPページの場合にSNSボタンを表示させるというのをやってみたいと思います。 AMPページの場合にSNSボタン用のリンクを表示するコード AMPページの場合に本文下にSNSボタン用のHTMLを表示させるには、下記コードをテーマのfunctions.php内に記述します。 functions.phpのどこでも構いませんが、わかりやすくすでに書かれているコードの下の方に記載した方がいいでしょう。 上記コードを記
HOME その他 WordPress使い方 AdSenseを非表示に！ウィジェットごとに表示する条件を指定できるプラグイン-Display Widgets WordPress使い方 2016.11.09 オープンケージ AdSenseを非表示に！ウィジェットごとに表示する条件を指定できるプラグイン-Display Widgets 簡単にパーツを設置できるウィジェットですが、AdSenseなどを使用している場合、特定のカテゴリーや記事では表示させたくない場合があると思います。 そんな時、複雑なプログラムを書いて表示を切り替えないといけないのかというと、そうでもなくて、実は Display Widget という プラグインを使って簡単にウィジェットの表示非表示を切り替えることができます。 ウィジェットの表示条件を設定したい場合に便利なので、AdSense広告をある特定のページで表示させたくない
ご注意下さい このショートコードはオープンケージ製のテーマでのみ利用可能です。他のショートコードプラグインを使用している場合、設定が競合してしまう可能性があるので、十分ご確認ください。 記事中に関連記事のリンクを画像つきで表示 記事内に表示させたい記事IDを入力するだけで、キレイなリンクがつくれます。 単一の場合： ラベル無し 単一の場合の書き方 [kanren postid="2748"] ラベル無し [kanren2 postid="2748,2456"] 記事IDの調べ方 WordPressカスタマイズに！IF文(条件分岐)の使い方まとめ〜スラッグを指定している場合のIDの調べ方〜
OPENCAGEのテーマのSNSボタンの部分で採用している、シェア数をカウントしてくれる「SNS Count Cache」ですが、Facebookのカウントがとれない状態となってしまっております。 Facebookのカウントがとれなくなったのは、一番はFacebook側の仕様変更が原因なのですが、SNS Count Cacheの最新版（v0.10.0）にて、うまく数値が取得できないのは、プラグイン側のバグも関係しているようで、そのバグを修正する方法をご紹介します。 プラグイン側でのFacebook設定 バージョン0.10.0より、Accesstokenを取得するために「App ID」と「App Secret」をプラグイン設定で保存できるようになりました。 App IDとApp Secretの取得方法 「App ID」と「App Secret」を取得するには、まずFacebook Devel
Yoast SEOってどんなプラグイン？ Yoast SEOは記事毎にタイトルタグを変更したり、OGPタグを設定したりすることができるプラグインです。 All in One SEO Packでも同様の設定が可能で、両者は互いに競合プラグインではありますが、それぞれ特徴があり設定方法も多少異なります。 両プラグインを見比べて、出来ること・出来ないことがそれぞれあるのですが、設定方法としてはYoast SEOの方が簡単な印象でした。 この後は、Yoast SEOの基本的な設定について紹介していきたいと思います。 Yoast SEOで最初にやっておくべき基本設定 Yoast SEOの設定で最初にやっておいた方が良い設定をご紹介します。 解説の前に、まずはプラグインをインストール＆有効化 プラグインの検索ページより「Yoast SEO」で検索し、インストールして有効化プラグインページ（Yoast
とことんモバイルファースト レスポンシブウェブデザインでつくられたストークは、スマホでの見やすさ・機能・デザインにこだわったモバイルファースト設計！導入してすぐにスマホに最適化されているので、これからのメディア設計に最適です。 美しいデザイン 当サイトの共通のコンセプトでもある「誰が使っても美しいデザイン」を追求し、HTMLやCSSの知識がない方でもデモサイトと同じような美しいサイトをおつくりいただけます。基本的に、設定はカスタマイザー（ダッシュボード > 外観 > カスタマイズ）から行えるので直感的で簡単です。 ショートコードを標準装備 ブログ運営においてよく使われるであろうショートコードが最初からそろっています。 ワクワクするような記事ページをつくることができるでしょう。ビジュアルエディタを使ってできるのでHTMLやCSSが苦手でも問題ありません。 ショートコードのサンプル記事
ご注意下さい このショートコードはオープンケージ製のテーマでのみ利用可能です。 他のショートコードプラグインを使用している場合、設定が競合してしまう可能性があるので、十分ご確認ください。 こちらのページのショートコードの表示は「ストーク」テーマのデザインが適用されており、若干デザインが異なる場合がございます。実際の表示に関しては、アルバトロスデモサイトのショートコードのページをご覧ください（基本的な使い方は同じです。） 記事中に関連記事のリンクを画像つきで表示 記事内に表示させたい記事IDを入力するだけで、キレイなリンクがつくれます。 単一の場合： 単一の場合の書き方 [kanren postid="2748"] 固定ページへのリンク 書き方 [kanren pageid="2619" label="none"] 最新バージョン（ver1.2.7）では、上の2種類の他にも 日付を表示しない
トップページのデザイン変更 トップページのデザインを3種類からお選びいただけます。サイトの思考に合わせて、シンプルタイプ、スライドショータイプ、ブランディングタイプの中から選ぶことができます。 また、テーマの機能として盛り込まれているものなので、サイトの成長にあわせてトップページを変更していくことも可能です。 トップページの設定について詳しく見る ウィジェット ウィジェットを分類ごとに細かくご用意しておりますので、管理画面からウィジェットを追加していくことで、簡単にサイトをつくり上げることができます。 メインサードバー、スクロール追従型、各Adsense広告用（PC、モバイル）、CTAなど、ブログマーケティングに必要なウィジェットが揃っています。 ウィジェットの設定を詳しく見る ヘッダーフッターメニュー グローバルナビや、ヘッダーの問い合わせボタン、フッターメニューなど4種類のメニュー設定
OGPタグはSNSなどで記事がシェアされた時に表示させる、画像や文章を設定することができるタグです。ハミングバードやアルバトロスでは、OGPタグを自動的に出力する機能がないので、設定するにはプラグインが必要になります。 人気のSEO関連のプラグインである「All in One SEO Pack」にてその設定が可能となりますので、その設定方法をご紹介します。 ※OGPとは？ OGPとは「Open Graph protocol」の略称です。 FacebookやTwitter、Google+、mixiなどのSNSでシェアされた際に、そのページのタイトル・URL・概要・アイキャッチ画像（サムネイル）を意図した通りに正しく表示させる仕組みです。 FacebookのOGP設定方法＋参考記事6選｜ferret [フェレット] テーマの機能としていない理由 冒頭でハミングバードやアルバトロスではOGPタグ
リンクをコピー オープンケージのテーマでは投稿者のプロフィール表示に対応しております。 その中で、投稿者のサムネイル画像の表示方法についていくつかお問い合わせを頂きましたのでその設定方法をご紹介いたします。 方法としては２パターンあります。 プラグインを利用する方法Gravatar（グラバター）を利用する方法 【1つ目の方法】プラグインを利用してプロフィール画像を設定 こちらが最も簡単な方法で「Simple Local Avatars」というプラグインを利用して画像を設定することができます。 Simple Local Avatarsをインストールして有効化 管理画面の【プラグイン > 新規追加】を開き「Simple Local Avatars」を検索Simple Local Avatarsをインストール＆有効化 Simple Local Avatarsの設定方法 このプラグインを有効化する
リンクをコピー ハミングバードやアルバトロスで、「Ptengine」などのアクセス解析コードをテンプレート内に追記しようとした場合、親テーマのheader.phpやfooter.phpをそのままカスタマイズしてしまうのが簡単ですが、これだとテーマの更新があった場合にデフォルトに戻ってしまいます。 また、アップデートの度にアクセス解析コードを追記していたら、思わぬヒューマンエラーが発生してしまうことも考えられるので出来る限り子テーマにて管理したいですよね。 ただ、テーマのコアファイルであるheader.phpを子テーマにコピーしてしまうとheader.phpのアップデートがあった場合に、便利な機能が使えなくなってしまうリスクも抱えてしまいます。 そういった場合に、アルバトロスとハミングバードではheader.php内に読み込まれるhead.phpというものがありますので、そちらを子テーマにコ
誰が使っても美しいデザイン マーケティングブロガー専用テーマ「ALBATROSアルバトロス」 アルバトロスは誰が使っても美しいをコンセプトに開発されたWordPress用テーマです。 シンプルなデザインでコンテンツをとにかく見やすく、モバイルファーストで設計されているのでスマートフォンで表示した際もデザインが崩れることなく美しいままです。 重要なお知らせ こちらのテーマは「クラシックエディタ」ベースのテーマです。 WordPressで「ブロックエディタ」をご使用になる場合は、 STORK19またはSTORK SEテーマをご検討ください。 STORK19とSTORK SEは、ブロックエディタに最適化されたテーマです。
オープンケージのテーマ専用の子テーマをこちらからダウンロードすることができます。 ご自身でご用意されたものでも問題はございませんが、下記よりダウンロードしてお使い頂くことをおすすめいたします。 テーマ名ダウンロードファイル
リンクをコピー WordPress4.4がリリースされましたが、今回もメジャーアップデートということで、新たな機能が追加されました。その中で画像のレスポンシブ対応（Responsive Images）があるのですが、環境によってはスマートフォンで見た際に画像が劣化しているようにみえることもあるようです。 この画像を最適化して表示する「Responsive Images」という機能は、デバイス毎に画像を最適なサイズで表示してくれるのでサイトの表示速度がよくなるというのが期待できる反面、画像を自動的に圧縮するため解像度が思っている以上に落ちてしまい、荒くなってしまう場合があるようです。 ソースはどのように変わるか 画像のソースコードを見るとよく分かるのですが、何やらコードが増えています。 srcset="~~~~" これは「横幅○pxの時はこの画像を表示しなさい」という風に自動的にWordPr
アニメーションで目立たせる ブロガー専用テーマ「Hummingbirdハミングバード」 ハミングバードは「誰が使っても簡単に美しいブログサイトを！」をコンセプトとして開発されたWordPress用テーマです。シンプルなデザインながら、アニメーション効果でさり気なくパワフルにコンテンツを目立たせます。 もちろんモバイルファーストで設計されているのでスマホでの見た目が抜群です。 重要なお知らせ こちらのテーマは「クラシックエディタ」ベースのテーマです。 WordPressで「ブロックエディタ」をご使用になる場合は、 STORK19またはSTORK-SEテーマをご検討ください。 STORK19とSTORK-SEは、ブロックエディタに最適化されたテーマです。
リンクをコピー アルバトロス・ハミングバード・ストークにて相性のいいプラグインをご紹介いたします。必須ではありませんが、導入することによりさらにサイトをパワーアップすることが可能です。 おすすめのプラグイン SNS Count Cache 各テーマで採用している独自デザインのソーシャルボタンに対して、カウント数を表示できるようになります。使い方についてはこちらの記事を御覧ください。 ソーシャルボタンのカウント設定（SNS Count Cache） All In One SEO Pack 有名なプラグインですが、SEO関連全般の設定をできます。タイトルタグの書き換えやSEO設定のためのmeta情報やソーシャル関連の設定まで行うことが可能になります。 Yoast SEO 上のAll In One SEO Packにならんで、高機能なSEO対策のオールインワンプラグインです。 All In On
次のページ
このページを最初にブックマークしてみませんか？
『ブログ向けWordPressテーマ「OPENCAGE」』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
