カテゴリー:アフィリエイトブログ

 

以前に、スマートフォンでWordpressの表(table)を横スクロールできるようにする方法で、表(table)を横スクロールできるようにすることはできたのだが、いかんせんこれだと、スマホで横スクロールした時に表(table)が見にくいと思っていた。

 

ので、その解決方法を記しておく。

 

ここでは、Wordpressの表(table)の列を固定させる方法を紹介する。

 

WordPressの表(table)の列を固定させる方法

 

表の列を固定させるには、「CSSカスタマイズ」と「HTMLカスタマイズ」を行う必要がある。

まずは、CSSカスタマイズから紹介する。

 

CSSカスタマイズ

 

 

テンプレートが「カエテンWP-JOY」の方は、Wordpressの管理画面(ダッシュボード)に移動して、「外観」➡「その他オプション」へと進もう。

 

その他の方は、「外観」➡「テーマの編集」➡「style.css(子テーマ)」へと進もう。

 

 

テンプレートが「カエテンWP-JOY」の方は、「通常ページ用CSS <head>設定」の欄にCSSコードを入力しよう。

その他の方は、「style.css(子テーマ)」に入力。

 

CSSコードは下記のページを参考にさせて頂いた。

 

【コピペ簡単】ヘッダー固定、スクロールヒントを表示させるテーブル【WordPress】

 

このページには他にも、スクロールヒントを出す方法も載っているので参考になる。

 

 

CSSコードを入力した。

 

 

CSSコードを入力後は、「CSS:変更を保存」ボタンをクリックする。

これで、CSSカスタマイズは完了である。

 

HTMLカスタマイズ

 

HTMLカスタマイズ方法も、先程のサイトを参考にして行った。

私は、「上部見出しが必要ない場合」の方を使用させてもらった(上見出しを固定するHTMLだと、iPhoneで見た時ぐわんぐわんと動く動作があるようだ)。

 

【コピペ簡単】ヘッダー固定、スクロールヒントを表示させるテーブル【WordPress】

 

 

「投稿or固定ページのテキスト画面」にHTMLをコピペで入力しよう。

後は、いつも通り表を作成して行けば良い。

 

日常漫画 著者 出版社 巻数 アニメ化 コメント

日常

あらゐ けいいち KADOKAWA 全10巻 あり 面白いです。

A子

男子高校生の日常

山内泰延 スクウェア・エニックス 全7巻 あり ギャグ漫画です。

B子

それでも町は廻っている

石黒正数 少年画報社 全16巻 あり 探偵もの?

C子

 

こんな感じになる。

 

 

実際に横スクロールしてみる。

列が固定できているのが確認できると思う。

ヒッキー
やったー。列が固定できた。

 

以上で、Wordpressの表(table)の列を固定させる方法の解説は終了する。

 

Amazonアソシエイトから英語のメールが来ていた。

翻訳すると要するに、PA-API v5への移行を2020年3月9日までにしなければならないそうだ。

なので、プラグイン(WPアソシエイトポストR2)やらでAmazonの商品を紹介している人は、何らかの対処をしなければならないようだ。

 

WPアソシエイトポストR2

プラグイン(WPアソシエイトポストR2)のPA-API v5への移行手段としては、「WPアソシエイトポストR2」をVer4.0に更新しなければならないようだ。

 

参考【アップデート必須】PA-API v5対応!WPアソシエイトポストR2 Ver4.0リリースのお知らせ

 

カエレバ・ヨメレバ

カエレバ・ヨメレバは、下記を参考に。

 

参考【重要】カエレバ・ヨメレバは、国内ショッピングモールを応援するサービスへ生まれ変わります

 

プラグイン(WPアソシエイトポストR2)の更新方法

 

プラグイン(WPアソシエイトポストR2)の更新方法としては、管理画面(ダッシュボード)から「プラグイン」の項目に移動する。

 

 

そうしたら、インストール済みプラグインの中から、「WPアソシエイトポストR2」を探して、「更新してください。」の「更新」をクリックする。

 

 

すると、Ver4.0に更新されるのだ。

 

 

カエテンWP-JOYを最新のテーマにアップデートしたら、ボタン機能が追加されていた。

 

 

こんな感じのボタンが、簡単に作成できるのである。

これだとボタンをわざわざ自分で作成する手間が省けるので、かなり便利である。

 

ボタンの作成方法

 

ボタンの作成方法としては、

リンク文字(URL付き)を選択後に、ビジュアル画面などで「スタイル」➡「ボタン」と選択するのみ。

色も複数あるので、好みで選択することができる。

 

注意点としては、リンク文字ではなく普通の文字だけだと、デザインが表示されないのである。

 

 

ボタン文字の大きさ

 

ボタン文字の大きさも簡単に変更できる。

「スタイル」➡「文字装飾」➡「文字サイズ」➡「28px」など好きな大きさに変更できるので便利だ。

 

 

 

カエテンWP-JOYのテーマを最新のにアップデートする際には、カエテンWP-JOY専用の「アップデート用サブテーマ 」をインストール後に、一時的に有効化しなければならない。

その後、古いテーマ本体を削除し、最新のテーマをインストール後、有効化すればOKとのこと。

 

・管理画面 ( 管理画面 ) で設定した事

・書いた記事

・導入しているプラグイン

の設定は、アップデート後も残るそうだ。

 

子テーマ

 

カエテンWP-JOYの「子テーマ」を使用している場合には、最新のテーマを有効化後に「子テーマを有効化」しなければならないのである。

 

じゃないと、子テーマでせっかくhttps化などの設定をしていたのに、その設定が全く反映されていなくて焦ってしまうので注意である。

 

 

「これはカエテンWP‐JOY(20190104)の子テーマです。」

 

子テーマを有効化して、テーマ画面から子テーマの「テーマの詳細」をクリックすると上記のような感じになっている。

子テーマが、最新のテーマ(20190104)になっていればOKのようだ。

 

注意事項としては、子テーマは絶対にアップデートしてはいけない。

アップデートすると、デフォルト状態になるとのこと。

 

サイドバーのウィジェット

 

ちなみに、カエテンWP-JOYのテーマを最新のものにアップデートする際に

アップデート用サブテーマ 以外を有効化すると ウィジェットの配置が変更 されてしまいます

とのこと。

 

WordPress 4.9から、らしいのだが実際にウィジェットの配置などを確認してみると、様々な場所に「テキストやメニュー」などが移動している場合もあるので確認にしておく必要がある。

必要のない以前サイドバーに載せていた「テキストやメニュー」が、ウィジェットのメインカラムなどに大量に残っていた。

 

で、必要のないウィジェットの「テキストやメニュー」などを全て消したら、若干サイト(ブログ)が軽くなった気もする。

 

サイドバーを入れ替えるプラグイン(Content Aware Sidebars)

 

その他、サイドバーなどを入れ替えるプラグイン(Content Aware Sidebars)を導入している方は、テーマをアップデート後、ウィジェット設定がおかしくなっている場合もあるので、アップデート前のサイドバーを覚えておく必要がある。

 

全く変化がない場合もあるが、変化していることもあるので注意したい。

 

特に「FS ヘッダー右側」でヘッダー画像を入れ替えている場合には、画像が右側に移動していることがあるので、管理画面(ダッシュボード)に移動して「外観」から「カスタマイズ」➡「フリースペース」➡「ヘッダー」へと進んで「FS ヘッダー右側」の設定をしておく必要がある。

 

 

最新のテーマ(20190104)だと、「FS ヘッダー右側」のみの設定で画像を左端に移動することはできなくなってしまったようだ(たぶん)。

なので、中央に画像がくるようにしておく。

 

「FS ヘッダー右側」にある「表示関連(横幅の設定)」の欄を空白にして保存すると、画像が真ん中に移動するようになる。