WordPress6.01

(wordpress6.01)に更新しようとしたら大変だったのでその辺を記述していこうと思います。

先ず、そのままバージョンを上げようして・・・
繋がらなくなりました、やったことは

  1. PHPバージョンが低いと言われ7.4に更新
  2. それでも動かないので元のバージョンに戻す
  3. でも、だめ!

WordPressブログをメニューに追加する方法

  1. 左メニュー投稿→カテゴリー→その他(デフォルトなのでカテゴリーを指定しないと皆このカテゴリーになる)のカテゴリー名を「ブログ」に変更
    スラッグ(URLに表示されるリンク名)はアルファベットのほうが見た目がGood
  2. 次に投稿一覧から「Hello Word!」と言うブログを見つけこれを修正する
  3. ブログが出来たらメニューに加える作業
    外観→メニュー→出てきた編集画面左側のカテゴリークリック→ブログにチェック→メニューに追加ボタン
    右側のメニュー構造の一番下にでるので場所を入れ替えて→「メニューを保存」ボタンを押せば完成です

カラム分け

  1. 「Shortcodes Ultimate」プラグインをインストール
  2. プラグインの有効化
  3. タグの挿入 (必ずテキストモードで入力)
    [su_row]
    [su_column size=”1/2″]
    ★ここに左側★
    [/su_column]
    [su_column size=”1/2″]
    ★ここに右側★
    [/su_column]
    [/su_row]

    同じように、★ここに右側★と書いてある所を★ごと消して、代わりに2カラムの右側に表示させたい文字や画像を入れます。そうすると、2カラムの右側に出ます。
    【su_column size=”1/2″】★ここに右側★【/su_column】
    黄色く網掛けした部分に挟まれた部分が右側に出るようになります。
  4. 応用編1)2カラムを『左を狭め、右を広め』で分割する方法
    先ほどのコードに(size )部分の割合を変えます。
    [su_row]
    [su_column size=”2/5″]
    ★ここに左側★
    [/su_column]
    [su_column size=”3/5″]
    ★ここに右側★
    [/su_column]
    [/su_row]
  5. 応用編3)3カラムにする方法
    縦に3分割する方法、以下のコードをコピーして本文に貼る。
    [su_row]
    [su_column size=”1/3″]
    ★ここに左側★
    [/su_column]
    [su_column size=”1/3″]
    ★ここに中央★
    [/su_column]
    [su_column size=”1/3″]
    ★ここに右側★
    [/su_column]
    [/su_row]
  6. まとめ
    先ず、カラムを作りたい部分を[su_row] と[/su_row]の間はさむ
    次に写真や文章等のカラムに入れるタグ[su_column size=”1/3″] と[/su_column]で挟む
    カラムの配置は(size=”1/2″ )部分で(”1/2″)部分は比率例えば2カラムで半分半分であれば
    [su_column size=”1/2″]
    ★ここに左側★
    [/su_column]
    [su_column size=”1/2″]
    ★ここに右側★
    [/su_column]
    カラムの数はHTMLの表と同じ考えかたで
    [su_column size=”1/3″]
    ★ここに左側★
    [/su_column]の数分がカラム数になります。

サイトカスタマイズ記録

2017_03_04 サイトカスタマイズ記録(Activelloバージョン: 1.1.1)
*テーマのバージョンアップ(バージョン: 1.2.1)により2の「ヘッダを分けるために使うテンプレートとヘッダPHPを作ります。 」部分で対応が出来なくなったために別の方法でヘッダ表示切り替えをします。
ヘッダの使い分け
(仕組みとしてはheader.phpのヘッダ表示部分を外しすべてのページでアイキャッチ画像をヘッダとして使用
しTopページ用固定ページには幅の広い画像を使用、こうすることによって各ページに固有のヘッダを付けることも可能)
注:テンプレートはデフォルトのまま
  1. header.phpのバックアップを作成しておく(今回は「header.php_2017_03_11」としました)
  2. header.phpの56~94行目当たりを外す
  3. FTPでアップロード
  4. Topページ用のページのみ幅広のアイキャッチ画像を使用
  5. 各ページに幅の狭いアイキャッチ画像を使用
 サイト使用テーマ (Activelloバージョン: 1.1.1)
サイト使用プラグイン
  1. Akismet Anti-Spam
  2. FormGet Contact Form
  3. Hide Title
  4. Single Post Template
  5. TinyMCE Advanced
  6. WP Multibyte Patch
  7. WP Social Bookmarking Light
  8. Imagemgickengine
左メニューの設定
  パーマリンク設定  投稿名
 サイトカスタマイズ
 ↓テーマを入れたばかりの状態

Topページとその他のページでヘッダを分けたい
このテーマはヘッダ専用画像を使ていないので、Topページをカスタマイズします。
  1. コントロールパネルの左メニューの設定→表示設定→固定ページを選んで→フロントページをTopにします→変更を保存

  2. 次にヘッダを分けるために使うテンプレートとヘッダPHPを作ります。
    注)テーマを更新すると変更がリセットされるので注意してください

    1. FTPでwp-content内のthemesから今使っているテーマのフォルダーを選択します
    2. 「header.php」をコピーして
      2017_03_05サイト使用テーマ (Activelloバージョン: 1.1.1)

      」としたから0行くらい上の「<div class=”cat-title”>」を外す
    3. 名前を「header-01.php」に名前を変更してアップロードする
    4. 「index.php」をコピーしてテキストエディターで開く
      中にある get_header(); ?> を get_header(’01’); ?> に変更()の中に’01’を入れます
      上部の*後にテンプレート名を「 * template Name:header-01.php」にして
      「get_header(”); ?>」の(”)部分に「header-01.php」のハイフン右の引数 01 を入れる
      →「ファイルを更新」でテーマ編集を閉じる
    5. 名前を 「template-01.php」に名前を変更してアップロードする
    6. 設定→表示設定→フロントページの表示の固定ページ→フロントページから先ほど登録したTopを選ぶ
      →変更を保存
  3. ページごとに表題を表示・非表示を設定できるプラグイン「Hide Title」
    インストール・有効化すると各編集ページの右メニューに以下のような設定が現れるので、非表示にしたいページで「Hide the title on singular page views.」にチェックを入れて下さい。ダウンロード

    entry-titleの要素に対してdisplay:noneを追加する仕組み。

  4. Topページのヘッダにアイキャッチ画像を入れてそれをTopページのヘッダ画像とします
    固定ページ一覧→Top→右メニュの「アイキャッチ画像を設定」をクリックしてTopページの画像を選択します。

  5. 次にこのページのみ全幅にします。

Wprdpress アイキャッチ画像をヘッダに利用する

1. [ ] header.phpを加工しますのでバックアップを取ります
2. [ ] 次にヘッダを分けるために使うテンプレートとヘッダPHPを作ります。
注)テーマを更新すると変更がリセットされるので注意してください
1. [ ] FTPでwp-content内のthemesから今使っているテーマのフォルダーを選択します
2. [ ] 「header.php」の57から96行目当たりの
「(Activelloバージョン: 1.1.1)ヘッダ外し部分
」としたから0行くらい上の「

」を外す

3. [ ] 「index.php」をコピーしてテキストエディターで開く
中にある get_header(); ?> を get_header(’01’); ?> に変更()の中に’01’を入れます←’’カンマを忘れずに
上部のテンプレート名を「*The main template file」を「 * template Name:template-01 」にして
→「ファイルを更新」でテーマ編集を閉じる
4. [ ] 名前を 「template-01.php」に名前を変更してアップロードする

ページの上にメニュー等を追加

WordPressの気に入ったテーマが見つかったけど「一番上にメニューを追加したいけどそのテーマはメニューの表示位置の変更が出来ない」と言った場合PHPとCSSをいじればすむのですが、テーマの更新があるとまた同じように変更しないといけなくなりますね。

出来る範囲は広くは有りませんがHTMLの一番上にメニューを追加するなどには便利なプラグインを紹介します。

メニューのプラグインの追加から「Per page head」を選択してインストール→有効にしてから、設定メニューから「Per page head」を選択して設定を開始します

「Everything you put in here will be inserted into the <head> tag on every page. Ideal for favicons!」でHTMLを入力します。

こんな感じで入力してみますここにプラスしてCSSのIDをプラスして整えます
<table border=”0″ cellspacing=”3″ cellpadding=”3″>
<tr>
<td><a href=”http://www.k-age.biz/top/”>Top</a></td>
<td><a href=”http://www.k-age.biz/category/pcx/”>バイクツーリング</a></td>
<td><a href=”http://www.k-age.biz/category/etc/”>その他</a></td>
<td><a href=”http://www.k-age.biz/category/cycling/”>サイクリング</a></td>
<td><a href=”http://www.k-age.biz/category/drive/”>ドライブ</a></td>
<td><a href=”http://www.k-age.biz/category/shigoto/”>仕事</a></td>
<td><a href=”http://www.k-age.biz/category/trip/”>旅</a></td>
<td><a href=”http://www.k-age.biz/?page_id=169″>ギャラリー</a></td>
</tr>
</table>

次に「Manage which users can access the plugin」で権限を設定して
「Manage post types that have the per page add to head box」でページごとに追加する投稿タイプを選びます。

「変更を保存」ボタンで終了です。