カスタマイズ

【Cocoon】タイトル下に記事抜粋(ディスクリプション)が表示されない時の対処法

wordpress
Cocoonは無料の人気のテーマで、このブログでも使ってますし、他の方にもおすすめしたりしてます。ただ、どうもトップページの表示(記事の一覧表示)で、モバイル表示(スマホ表示)で見ると、各記事のタイトル下に記事の説明(記事の抜粋:メタディスクリプション)が表示されないようですね。(パソコンでは表示されるのに何...

【Cocoon】スマホメニューの検索をアドセンスの検索エンジン広告に置き換える方法

wordpress
人気の無料テーマ「Cocoon」でスマホ表示したときに、下部のメニューに検索が表示されますが、これをグーグルアドセンスの検索エンジン広告に置き換える2つの方法を試してみました。置き換えたい箇所は「スマホ表示時のメニュー」(「モバイルスライドインメニュー」と呼ばれるもの)内にある検索。「検索」(虫眼鏡アイコン)...

【CSS】次の要素ありなしで表示を変える方法

CSS
以下のように「要素が1つだけ」の場合と「複数ある場合」とで表示を分けたい、ということがあります。たとえば記事の先頭によくある、カテゴリ、タグの表示などで、1つしか表示する要素がなければ、それだけを表示する。複数(つまり次の要素が)あれば、スラッシュ( / )で区切って表示するなんていう場合がありますよね。<要...

【WordPress】記事タイトルHTMLタグを入れる方法!ブラウザ向け対応も忘れずに

カスタマイズ
この記事のタイトルは、一部色が変わっていたり「!」の後に改行されていたりと、タイトル(H1)にHTMLタグが入ってます。このブログでは「Coccon」というテーマを使ってますが、「Lightning」や「Luxeritas」など他のテーマでも同じことができますね。ここではワードプレスにおいて、記事タイトル(H...

【WordPress】フォーム内ラジオボタンにcheckedを入れる方法

wordpress
ワードプレスで独自プラグインや自作関数の設定を作る場合、よくフォームで利用するラジオボタン。チェックされた設定を保存した後、その値を読み込んでhtmlに「checked」を入れる方法の解説。ifの値比較、三項演算子の利用もあるが、ワードプレスで用意されているchecked関数を使うのが分かりやすい。

【WordPress】設定画面へラジオボタンやチェックボックスを追加で完成形へ

plugin
Settings APIを使った設定画面で複数行入力(textarea)、ラジオボタン(input type radio)やチェックボックス(input type radio)を使ってフィールドを追加してみる。ラジオボタンやチェックボックスでは「checked」の入れ方がポイントとチェックボックスでは更にnameに配列を指定するのがポイント。

【WordPress】投稿一覧に更新日の列を追加する方法

wordpress
ワードプレスにログイン後の管理画面にある投稿一覧では、日付順(投稿日順)には見れますが、最終更新日順の列がない!更新日順の並替えができると、過去記事の見直しをする場合も、どの記事がまだ更新できてないか、最終更新順に並替えて(古い順に見たりすれば)すぐわかって便利です。ということで、実際最終更新日の列を追加して...

【Cocoon】スマホ表示時のアドセンス検索エンジン広告!8つのレイアウトの表示のされ方

wordpress
Cocoonのスライドインメニュー(スマホ表示の下部メニュー)をアドセンスの検索エンジン広告に置き換えた時の見え方をチェックしました。アドセンスの検索エンジン広告は、見え方(レイアウト)を複数の中から選べますが、結果としては「Googleがホスト」のレイアウトが良さそうです。関連)【Cocoon】スマホメニュ...

【Cocoon】モバイルメニューカスタマイズ:テーマファイルのダウンロードとアップロード

wordpress
Cocoonでモバイルメニュー(スライドインメニュー)の「検索」ボタンをアドセンスの検索エンジン広告に差し替える、といったカスタマイズなどでは、テーマファイルのダウンロードやアップロードが必要になります。この場合、対象ファイルは「mobile-search-button.php」になりますが、ここではそのダウ...

WordPressでfunctions.phpを別ファイルに分ける方法!簡単な記述で管理をグンと楽にする

plugin
ワードプレスでfunctions.phpに自作の関数を追加する場合、コードが長くなり分かりづらい、複数の関数追加でもどこに何があるかわかりづらい、となる場合がある。ここではinclude/include_once, require/require_once, get_template_partを使ってfunctions.phpのファイルを分け外部ファイルとして読み込む方法や読み込み方の違い、使い分けをご紹介。

【WordPress】CSSを別ファイルで読み込む方法|SettingsAPIでの個別ページ反映

plugin
SettingsAPIを使って自作プラグインや独自の設定画面にCSSを反映する方法の解説。wp_register_style()、wp_enqueue_style()を使うがポイントはwp_register_style()を実行する時に使うフック。(wp_enqueue_scripts か admin_enqueue_scripts か)サンプルコードで実際CSSを読み込んでそのページだけにCSSを反映させる動作検証。

【ヘッダタイトル】文字だけのロゴ画像の作り方!背景を透明にする方法(PhotoScape編)

カスタマイズ
ブログのヘッダー画像を設定すると、テーマによってはそのヘッダー画像の上にサイトタイトルやキャッチフレーズが表示されるものがあります。(Cocoonなど)背景の画像の上にタイトルの文字が乗るため、背景の画像に溶け込んだりしてタイトルの文字が見づらくなる場合がありますが、こうした時には文字だけのロゴ画像を作成して...

ブログ記事一覧のサムネイル画像をマウスオーバーで拡大させる!CSSで簡単カスタマイズ

CSS
ブログの記事一覧表示にアイキャッチ画像(サムネイル画像)を表示している場合が多いですが、その画像にカーソルを乗せる(マウスホバーさせる)と、「画像がふわっと拡大表示される」という場合がありますね。この「画像がふわっと拡大表示」は実はCSSを使って簡単に実現できますので、是非試してみてください。(私が使っている...

add_settings_fieldのidはinput要素のid属性と同じにする必要はない?

wordpress
ワードプレスの関数リファレンス(日本語版)では Settings APIのadd_settings_field関数にはパラメータ$idがあり「input要素のid属性と同じにする」旨の記述がある。実際には同じにしなくても動作するが、どういった場合どのような理由で同じにする必要があり、どのような場合には同じにする必要がないのか調べてまとめてみた。

【WordPress】投稿一覧に最終更新日からの経過日数を表示する

wordpress
ワードプレス管理画面の投稿一覧に「記事の最終更新日から何日経過しているか」の列があると良さそうですよね。記事を投稿したり最後に更新した日から何日たっているのか経過日数の表示があると、記事更新の目安にする(1カ月以上経ったら見直すなど)に活用できそうです。ということで、早速追加してみましたのでご紹介!関連)最終...