Wordpressのカスタマイズ備忘録

Wordpress

AFFINGER4(アフィンガー4)でやった設定・カスタマイズ備忘録

更新日:

AFFINGER4 本当に便利ですね。プログラミング初心者の私でもこんなにいろいろレイアウトを変更できるのですから本当に感謝です。

このページでは自分のメモ用にAFFINGER4でカスタマイズしたことをメモしています。ゆくゆく複数のサイトを立ち上げていくにあたって設定を控えておいた方が分かりやすいので。
カスタマイズごとの記事を書いたら更新情報を発信していくので宜しければポケットやツイッターなんかでブクマしといてください。

以下、今のところやったカスタマイズや設定一式。


カスタマイズ画面より

・ロゴ画像>ginpで透過pngで作成したものをup (600x200 px)
・ロゴ画像>ヘッダーロゴ画像を使用する
・基本エリア設定>サイト背景色の変更
・基本エリア設定>ラインの高さを5pxにする
・基本エリア設定>ラインの横幅を100%にする
・基本エリア設定>ヘッダーの背景の横幅を100%にする
・基本エリア設定>PC時の記事のエリアの幅を広げる
・基本エリア設定>フッターの背景色を100%にする
・基本エリア設定>フッターの色を変更(任意)
・メニューカラー設定>メニューの横幅を100%にする


アフィンガー管理より

・ヘッダーにキャッチフレーズを表示しない
・ヘッダー上部にフッター用リンクと同じリンクを追加する
・トップページ設定>下層ページのサイドバーの新着記事一覧を非表示にする
・トップページ設定>トップページのサイドバーの新着記事一覧を非表示にする
・その他の設定>演出>記事エリアの画像表示をスクロールでフェードインする(推奨)


ウィジェット関係

・サイドバーにSNSアイコンを設置>子テーマ css と header.php に追記してウィジェットにテキスト入力 アイコンはgimpで作成
%e3%82%b5%e3%82%a4%e3%83%89%e3%83%90%e3%83%bcsns

画像を挿入するためにクラスを追加、高さが揃わなかったので中央属性を追加して更新

参考1:WordPress:サイドバーにSNSやfeedlyのオリジナルボタンをオシャレに設置!
http://web-ashibi.net/archives/799

参考2:【CSS】画像とテキストを中央で揃える方法【vertical-align】
http://teamsanta.info/web/2399/


広告配置

更新日の下にアドセンスの挿入(スマホ)
・single-type1.php にアドセンス広告を挿入

ここに以下のコードを挿入

パンくずリストの上にアドセンスの挿入(PC)
・single-type1.php にアドセンス広告を挿入

ここに以下のコードを挿入


記事下アドセンス横並びにする
・st-ad-on.php のコードを書き換え

CSSに追記


抜粋文の削除

・itiran-thumbnail-on(offのほうも).php の抜粋文のコードを無効化する


固定SNSボタンとハンバーガーメニューの設置


・パンくず、登校日、タイトルのフォントサイズの変更、マージン調整
・関連記事の抜粋文削除

・おすすめ記事の抜粋文をスマホでは表示しないようにする

 

 


自動OPG設定 (AFFINGER4では導入済みだったので不要でした。現在は削除してます)

・head内に挿入

 

 


サイドバーをPCとスマホで切り替え

サイドバートップの広告をPC版はビックバナー、スマホでは通常サイズに分岐したい。
ウィジェット内はPHPの記述を読み込まないのでサイドバーPHPで「サイドバートップ」をPCでのみ表示、「サイドバーウィジェット」をスマホのみ表示となるように分岐させた。
現在は「サイドバートップ」をPC用、「サイドバーウィジェット」をスマホ用として使い分けしてます。

・sideber.phpを変更

 

ゆくゆくはちゃんと記事にします。

この記事が気に入ったら
いいね!しよう

Twitter で

パパ・ママに読まれてる記事Top3

有給休暇 発生 タイミング 表 1

今回は有給休暇の話です。 ゆずぽんは普段は総務部で働いています。 仕事柄、社員さんたちから有給休暇制度について相談を受け ...

2

7月11日にオープンした ららぽーと新三郷のリトルプラネット! 休日はフリーパスは先着5組までです。 今日はオープンの1 ...

3

こんにちは。 今日は我が家で大活躍している除菌スプレーを紹介します。 本当に優秀なので凄くオススメです。是非試してみてく ...

-Wordpress

Copyright© 子育て夫婦が仲良しでいるための100の事 , 2018 All Rights Reserved Powered by AFFINGER5.