HOME　→　　→　
投稿日:

Twenty Seventeen ページトップへ戻るボタンの設置

WordPress Twenty Seventeen
画面制御ボタンのカスタマイズ
ページトップへ戻るボタンの設置
 
ページをスクロールすると、画面右下に「トップへ戻る」ボタンが浮かび上がってきて、これを押すとページの先頭に戻るボタンを設置した。
以下に、この方法を記述。

 

HOME　→　　→　
投稿日:

WordPress SNSボタンをサイドバーにウィジェットで表示

WordPress Twenty Seventeen
SNSボタンのカスタマイズ
サイドバーにウィジェットで表示
 
サイドバーにも「カスタム HTML」というウィジェットで【 SNSボタン 】を表示。 
SNSボタンをサイドバーにウィジェットで表示
 
以下に、この表示要領を記録。

 

HOME　→　　→　
投稿日:

WordPress 軽量のソーシャルボタンを自作し、任意の場所に表示する

WordPress Twenty Sixteen カスタマイズ
SNSボタンをまとめたショートコードを作成し、
任意の場所に表示
 
①．「PageSpeed Insights」で測定すると、【 Poor 】と遅い。
②．「WP Social Bookmarking Light」プラグインを使用しているが、表示位置が自由にならない。
 
軽量のソーシャルボタンを自作

という理由で、最も軽いソーシャルボタンをPHPファイルで作成し、SNSボタンを投稿ページや固定ページの任意の場所に、PHPファイルを動かす 『ショートコード』 で表示できるようにした。
 
以下、ソーシャルボタンをPHPで作成し、そのPHPファイルをショートコードにする方法を纏めた。

 

HOME　→　　→　
投稿日:

Twenty Seventeen メニューバー高さと背景色を変更する

WordPress Twenty Seventeen
画面デザインに関するカスタマイズ
メニューバーの高さと背景色を変更する 
 
Twenty Seventeen のヘッダー画像の色調に合わせて、メニューバーの背景色を変更するとともに、ナビゲーションメニューの高さがありすぎるので、高さを狭めるカスタマイズを行った。

 

HOME　→　　→　
投稿日:

Twenty Seventeen リンクの 文字・色・下線 のカスタマイズ

WordPress Twenty Seventeen
画面デザインに関するカスタマイズ
リンクの 文字・色・下線 のカスタマイズ
 
「Twenty Seventeen」のリンク文字は黒で、そこに黒い下線が引かれてリンクの目印となっている。また、リンクにマウスを合わせると、下線がひとまわり太く表示されるように設定されており、さらに、背景色を変更してみると白の下線も引かれている。
以下に、これらのカスタマイズ要領を記す。

 

HOME　→　　→　
投稿日:

WordPress 投稿一覧・固定ページ一覧に「最終更新日」を表示する

WordPress Twenty Seventeen
『投稿一覧・固定ページ一覧』のカスタマイズ
「最終更新日」を追加表示
 
フィードの配信やSEO対策を始めると、記事の内容を改善した更新日が気になりだす。そこで、WordPressの管理画面の『投稿一覧』に「最終更新日」の項目を追加表示して、「最終更新日」で記事を並び替えれるようにした。

 

HOME　→　　→　
投稿日:

「Crayon Syntax Highlighter」の使い方

WordPress Twenty Seventeen
記事作成のために導入すべきプラグイン
「Crayon Syntax Highlighter」の使い方
 
WordPressで記事を投稿する際に、HTML や CSS あるいは PHP のソースをサンプルとして表示させたい場合が多々ある。以下に、これらのソースコードを記事に張り付ける方法を記す。

 

HOME　→　　→　
投稿日:

WordPress 初期段階での最低限のカスタマイズ事項

WordPress Twenty Seventeen
初期段階での最低限のカスタマイズ
 
WordPress Twenty Seventeen の外観を、初期段階での最低限のカスタマイズとして、次の3項目をカスタマイズした。
 
①．サイトとページのタイトル文字を変換しないに変更する。
②．固定ページにサイドバーを表示する。
　　（参考：固定ページのタイトルを非表示にする ）
③．ウィジェット（サイドバー）のタイトル文字のサイズを変更する。
 
以下に、これらのカスタマイズ要領を記載。