wordpressで画像を並べるには「ギャラリー」という機能を使えばいいのだろうけど、このギャラリーはもう一つだ。
例えば、タイトルと説明をつけた画像をならべて、その説明にリンクを貼るといったことをしたい場合やはりhtmlとcssの出番となる。
それにはcssを登録してやらなければならないが、それを簡単に登録できるプラグインを先ず入れておこう。Simple Custom CSS　というプラグインだ。
これはインストールすると「外観」の所に出てくる。そこを起動して、あらわれた画面にcssのコードを書いて、updateボタンを押してやるだけで反映する。
では、やってみよう。
記事は「テキスト」を選んで、以下を記述する。

そしてdtの「タイトル」の前に「メディアを追加」でimgを入れる。

ここではdl環境を使う。これはとても便利でtable環境より柔軟性があってレスポンシブにも対応しやすい。（この件については以前書いた。）
要するにdtに画像とそのタイトルをおいて、ddにその説明文を置く。その上でそのdlを一つのボックスのようにして、floatで並べるという方法だ。

cssは以下だ。これを先ほどのSimple Custom CSSを起動して現れた画面に書いて、updateボタンを押してやる。

実例は以下のようになる。

ただしここでしっかりそろえるには画像の縦横比が全て同じでなければならない点だ。

ワードプレスのSEO対策でGoogleにsitemapを登録するにはやはりプラグインを使う。
ところがこれがまたよくわからない。結局はできたようだが、色々と振り回された。その顛末。

プラグインはGoogle XML Sitemapsを使う。
設定で色々とやれば
自分のドメイン/sitemap.xmlができたと言う。
そこでGoogleのウェブマスターツールにアクセスし、サイトを登録してそのsitemap.xmlをテストするとエラーが出てしまう。
そこで、FTPで自分のサーバー上を見てみると、sitemap.xmlが見当たらない。これではエラーが出るのが当たり前。
ただ、プラグインの画面にある「自分のドメイン/sitemap.xml」にブラウザでアクセスするとちゃんと表示される。
どういうことだ！

ここで色々と悪戦苦闘（でも２時間ぐらい）してしまった。

結論はやはり仕様変更にあった。プラグインの。この情報は「メモトラ」さんのブログから得た。
Google XML Sitemapsは4.0以降動的にsitemapを生成できるようになり、これはとても便利になった。しかし、「自分のドメイン/sitemap.xml」というファイルはFTPでは見えなくなったのだ。
要するに存在しない。だからエラーが出るのは当たり前だ。
じゃあファイルはどうなったのか、
http://自分のドメイン/index.php?xml_sitemap=params=
となったようだ。つまりはここで生成されていく。
したがって、マスターツールでのサイトマップのテストではこれを指定しなくてはダメだということだ。

やってみたところ。OKでした。はい。

wordpressとfacebookの連携についてあれこれと書いた。

その後、実際にあれこれとやってみたので、結論。

情報が錯綜していたのと、facebookがプログラムの仕様を変えたのが原因して、混乱があったようだ。

結論的には以下だ。

1. facebookのdeveloper登録をして、その上でWebアプリを作る。
2. アプリidとパスが発行される。
3. wordpressにFacebook公式プラグインを導入する。
4. そのプラグインの一般設定でアプリidとパスを登録する。
5. その後はそのプラグインでいいねボタン等の設定をする。

これだけでいいはずだ。facebookのdeveloper登録とアプリ作成がやや面倒だが、プログラムを貼ったりしなくて済むので簡易といえば簡易である。

後はプラグインAll In One SEO が入っていれば、その中のSocial Meta の中の Image Settings の中でOG:Imageにサイトを象徴する画像をUploadすれば、イメージをあまり使わないこのサイトにはいいかもしれない。ここの画像がFacebookに現れる。

スクロールが下まで行くとナビゲーションバー（ヘッダ部分でもいいけど）を上部に表示
これはjqueryで簡単に実現できる。
cssに以下を記述しておく

要するにナビゲーションを固定するクラス
これを例えば.navに与えるかどうかの制御で実現できる

スクリプトは以下だ。

まず変数navにクラス名navを持つナビゲーション部分を代入
次に変数navTopにnavの位置を代入
位置は最初の要素の、ドキュメント上での表示位置を返してくれるoffset関数を使う。
ここはtopの位置
さらにscrollイベントの中で
変数winTopにスクロール位置を代入
スクロール位置は.scrollTop関数を使う
この位置を比較して、スクロール位置がnavの位置より下だったらクラスfixedを追加
そうでなければ、クラスfixedを除去
これだけ。
実際は以下。

これはfooterについても言える。

ページをスクロールすると「トップ」へのアイコンが現れるページをよく見かける。
これもスマホで見る場合が多くなたためと思われる。また、縦長のページが増えているためかもしれない。
この縦長ページもスマホ用という感じがする。スマホはパソコンと違って、縦のスコロールが容易だからだろう。
このスクリプトを探してみたので報告。

まずHIML

これは単純に文字列とする。リンク先はwrap。場合によってはcontainer。

CSS

まずは現れる場所をposition: fixed;で固定。

リンクで文字を装飾。ここはいろいろ好みで。

JAVASCRIPT

ここは自分の理解のために解説してみる。

変数topBtnに#page-topを代入
これを非表示
scrollイベントを使って、スクロールが起きたら以下を実行
.scrollTop() でスクロール位置を取得
それが100を超えたら
topBtn（すなわち#page-top）をフェードインする
でなければフェードアウト

また、
clickイベントを使って、クリックされたら
animate関数をつかって、
ページをスクロール０の位置に500msで表示する。
なお、return false;は
clickイベントを実行した後にリンク先に移動してしまう
それを防ぐ為の記述らしい。よくわからないけど。
この点については柴原氏のブログにある。
以下の記述となる。

実際は公開した以下のサイトで
http://ogu-tec.net/test/webtest06/ypcwebtest02/

スクリプトはヘッダに書きます。

これについてはwordpressに連携のためのプラグインを導入すれば簡単に実現できると思っていた。
ところが豈図らんやそう簡単ではなかった。その顛末。
実は昨年の夏頃にfacebookアプリの仕様が変わって、これまでの設定情報が古くなり、うまく動かなくなってしまったようだ。

そこで、色々と情報を収集して、試みてみた。
一番信用できそうな情報は以下のサイトである。
「2015年度版WordPressでFacebookアプリを使う為のDeveloers登録とアプリ作成手順」

2015年度版WordPressでFacebookアプリを使う為のDeveloers登録とアプリ作成手順

これによる手順はこうだ。
1.Facebookで開発者登録
2.Facebookアプリの登録
3.Facebookアプリの設定
4.OGPの動作確認
5.WordPressにコードを埋め込む
6.OGPの設定

これを見ただけでも嫌になってしまうが、そのいちいちがまた面倒だ。順を追ってみるが、基本的には上記のサイトに詳しく出ているのでそれを参考にするのがいいのだが、わかりにくい点を補っておく。

1.
https://developers.facebook.com/　にアクセス。
My Apps→Register as a Developerで登録
携帯の電話番号でsmsでコードを取得して本人確認する。

2.
My Apps→Add a New App　でアプリ名（なんでもいい）を入れてCreate New Facebook App ID

3.
メルアドや自分のサイトを入力して、status画面で公開処理をする。

4.
https://developers.facebook.com/tools/debug にアクセスして確認
これをやる前にwordpressにfacebookの公式プラグインを入れて設定しておくといい。
ただ、設定には開発者登録情報が必要。

5.
「すると、「Quick Start for Website」の画面が開きますので、「Setup the Facebook SDK for JavaScript」に記載されているコードをコピーして、WordPressのヘッダー部分に貼り付けます。」
とあるが、「WordPressのヘッダー部分」というのがよくわからない。ブログのテーマ編集からheader.phpのの直後に貼り付けてみる。
ただ、
The following snippet of code will give the basic version of the SDK where the options are set to their most common defaults. You should insert it directly after the openingtag on each page you want to load it:
とあるので各ページに貼らないといけない気がするが。この辺りがわかりにくい。
さらに、いいねボタンを表示したい場所にタグを貼るとある。タグは以下だ。

そこでこれをテキストウェジットに貼って、サイドバーに表示してみた。

6.
「ただし、Facebookの公式Plugin「Facebook」を使うとOGPを自動で吐き出してくれますので、個別設定が大変だという場合はこちらを使うのが一番簡単です。」とあるように4.でのべたプラグインでできるようだ。

その上でプラグインでlikeボタンを各記事に貼ってみた。そして自らいいねを押してみる。すると自分のfacebookのタイムラインは表示された。しかしニュースフィードには表示されない。ただ、「友達」のニュースフィードには表示されたようだ。
これでいいのかな。