記事のタイトルを書き忘れた時の処理はどうすれば良いのか?
ワードプレスの場合は本来タイトルが表示されるところが空欄になってしまうので、
レイアウトの仕方によっては間抜けな記事になってしまう。
クライアントさんの中には、たまにいらっしゃるんですよね。
そこで、自動で「無題」とでも入るような処理はできないものかとググってみたらありました。
他に公開ボタンをクリックすると「タイトルを書き忘れていますよ!」と注意してくれるようなやり方もあるようです。
ただ、これはメールで投稿するような人に有効ではありません。
この記事は前者の例です。
さて、どうでしょう・・・。
カテゴリーアーカイブ: カスタマイズ
>>>12件の記事があります。
スクロールしたときにサイドバーを追従させる
プラグインの導入なしでやろうと色々試してみましたが、なかなか首尾よくいきません。
結局プラグインのお世話になることに。
筆者の感想としては、「Standard Widget Extentions」が設定が楽なので導入しやすいかと。
理由はテーマフォルダ内のファイルを弄る必要はまったくありませんし、
3カラムにも対応しているところが実に素晴らしい。
プラグインなしの挑戦をしているときに見つけたNGなスクリプトを幾つが挙げておきます。
・スクロールしたときにサイドバーは追従するが、ページトップに戻ってもサイドバーは戻らない。
・PCではちゃんと機能するが、スマホやタブレットではおかしな動きになる。
以前からずっと気になっていた、スクロールすると真っ白けになってしまうサイドバーからはもうオサラバです。
ただ、逆に固定や個別ページでコンテンツの方がサイドバーより短い場合は・・・?
ナビゲーションで少し遊んでみる(第二弾)
スクロールしてナビゲーションのメニューバーが一番上にきたときに、
固定されるというスクリプトを導入してみました。
DEMOはこのサイトで稼働中です。
原理は簡単らしいのですが、自分で書けるはずもなく
例によって親切な方がアップされている
スクリプトを使わせて頂いています。
メニューバーの幅が100%ではなく、しかも中央に持ってきたい場合は
CSSの設定もちょっとパズル的な要素がありますね。
メニューバーより上の部分を最初から固定するよりも
この例のようにした方が、表示できる部分が広がってスマートな感じがします。
もう一つ良い点を挙げるなら、前回の例だとdisplay:noneの部分を別に用意する必要がありますが、
この例ではその必要がありません。
まあ、他人が見て導入してみたくなるようなスクリプトを一度で良いから
自分で書いてみたいもんです。
ナビゲーションで少し遊んでみる
最近よく見かける、ある程度スクロールすると表示されるナビゲーションバーを取り付けてみた。
DEMOは www.kfk-kikaku.com/example/ にあります。
言うまでもないだろうが、jqueryを利用している。
これは縦スクロール幅の大きいブログのようなサイトでは非常に有効ではないだろうか。
基本的にはトップとボトムにスクロールするためのリンクマークと同じなので、
スクリプトも一つにまとめた。
今回ちょっと苦労した点は、最初参考にさせてもらったスクリプトが
プラグインだと思うがコンフリクトを起こして
まったく動作しなかったことだ。
幸い、よく考えてみると以前から取り付けていたスクリプトと
基本的な動作は一緒だということに気付いて事なきを得た。
jqueryは色々と遊べて面白い。
子テーマの設置
懸案だった子テーマの設置がやっと完了した。
元々このブログのテーマフォルダは「weblog」としていたので、
間違ってアップデートされるなんて考えられない。
だから、無理矢理子テーマの設置もどうかと思ってそのままになっていた。
まあ、一番良いのはfunctions.phpファイルに関してではないだろうか。
親フォルダにある従来のファイルに付け加えたい分だけの機能を書き足せば良いので分かりやすい。
もちろん、外したい機能もあるのでそれに関してもコードを書き加えれば良い。
cssとjavascriptは一元管理化すれば、不必要なファイルは読み込ませないようにできる。
これに関しては、まだ道半ばといったところかな。
それでも、お蔭様でソースが少しはすっきりしたように思う。
read moreを使ったときの問題点
read moreを使ったときの問題点としては、 リンク先のURLに「/#more-数字」がつくことばかりが話題になっていて、
それを如何にして取るかの説明がなされている。
何故問題なのかの理由もよく分かる。
ただ、この問題が解決されたとしても、まだ他に問題があるじゃないかと思うのだ。
「続きを読む」をクリックして表示されるのはページの先頭からであり、
spanタグが空になっているせいで、どこからが未読なのか一見して分からない。
行間が空いているにしても、何かスマートではない。
ここからが未読部分だよ!」的な表示がspanタグに自動で入ると何の問題もないのだが・・・。
これらの問題をすべて解決してくれるプラグインが存在するようだが、
できることならプラグインの乱用は避けて、
functions.phpへコードを書き加えることで済ませたい。
空タグの問題を解決できるような記事はほとんどないので、探すのにちょっと苦労した。
結局、functionのコードを少しアレンジしただけで思い通りの表示に成功!
いや~、苦労した分だけ目的を達成できたときの喜びは大きい。
機能を盛り込むことは大切かもしれないが・・・
その前に色々と簡素化できるところは、思い切って実行していくべきかもしれない。
例えば、典型的なものがカスタムメニューのクラス名だと思う。
一見してあんなに必要なのかと目を疑ってしまう。
このブログでもちょっと実行してみた。
従来自動で付くものはフィルターで取ってしまっても良いのではないか。
しかしながら、当然残すべきものもある。
current-menu-itemは良い例だろうし、ポップアップメニューにするのなら
current-menu-parentも残すべきだろう。
階層が深くなれば残すべきものが増えるのも当然と言えよう。
素人目にはbodyタグに付くクラス名もあんなに必要かと思ってしまう。
まあ、一番すっきりさせたいのはheadタグ内ではないだろうか。
使っているプラグインの数が多いのも原因の一つで、訳の分からないソースの多いこと多いこと。
ここを見ると、何だか自分の机の上に似ているような気がする。
camera.jsの改造(続編)
1回ループしたあとに最初に戻って停止というオプションがあれば何の問題もないのですが、
残念ながらありませんので自分で何とかしなければなりません。
裏技的なやり方で、最後の画像で停止というのは何とかできていました。
ただ、これは最後キャプションが消えたりとかして、決してお勧めできる方法ではありませんでした。
今回は幸いにも下のページを見つけることができましたので、何とか目的が達成できました。
blog.cgfm.jp/garyu/archives/2886
改造方法を書いて下さった方に厚くお礼申し上げます。
筆者の場合、改造すべきところをそのままコピペという訳にはいきませんでした。
その代り少し変えれば、キャプションを表示させたまま最後の画像で停止ということも可能です。
この改造に伴い、ローダーはパイからバーに替えました。
注:スクリプトはトップページにのみ取り付けています。
ヘッダーのcamara.jsを少し弄ってみることに・・・
どうしてもループを1回で終わらせたくて少し弄ってみました。
本当は1回ループしたあとに最初の画像を表示させて終わらせたかったのですが、
何分javascriptの知識がないもので、これが精一杯です。
因みに使ったのはbreak文。
幸か不幸かキャプションは最後消えます。
強引な感じの処理なので、ループが止まった訳ではなく
存在しない次の画像をいつまでもローディングし続けている状態になっている模様。
ネットで検索しても正しいやり方がなかなか見つからない。
サンプルのインフォメーション表示パターン
インフォメーション2のタイトルをクリックしたときに個別ページではなく、
全件の記事がループで表示されるページを追加しました。
詳細ボタンをクリックすることにより表示されます。
件数が少ない上に記事が短いときには、こちらの方がスマートかもしれません。
固定ページに専用のテンプレートを用意すれば簡単です。
詳しくはメニューのEXTRA→NOTEBOOK→MEMO-1をご覧下さい。
それぞれの記事はcustom-post-contentで囲われていますが、
境界線を表示させる場合はborder-bottomを指定します。
hrタグは使わない方が良いでしょう。
なお、border-bottomにはlast-childセレクタを使って、
最後のdivのborderに線が表示されないようにしましょう。
フッターのところの境界線が同じならば、この限りではありません。