脳窓全開ブログ

どうでもいいことにムキになりながら無駄に熱く長く書きなぐる日記帳ウェブログ。毎日更新!

    カテゴリ:■ブログのこと > カスタマイズ関連

    computer_programming_woman


    このブログのカスタマイズに関する「備忘録」としての個人的MEMOです。
    今回おこなったカスタマイズは、下記3点。

    1. はてなブログ風「ブログカード」挿入
    2. Hタグデザイン変更
    3. Evernote連携

    以上です。

    興味のない人は読み飛ばし推奨です。


    【ブログカード挿入&Hタグのデザイン変更&Evernote連携】の続きを読む ■EDIT


    JUGEMからWPを経て、この度ライブドアに移ってきました。となると、当然いろいろカスタマイズする必要性が出て来るわけです。

    で、ひとまず基本的なところはやったので、その備忘録を兼ねたカスタマイズMEMOです。




    【【LD】181122(金):例によってブログをいろいろいじくったよ日記】の続きを読む ■EDIT

    WPに移行したばかりということもあって、今日も今日とてブログ関連の日記。因みにこれ仕事中に合間を縫って書いているのと、もう終業間際なんで業務日報的に書こうと思う。

     今日やったこと

    ・ロリポップに正式契約するために、おさいぽ!で支払手続きをした。

    何気にレンタルサーバーを契約するの生まれて初めてなもんで、初期費用がかかるということを完全に失念しており、1ヶ月分のみの契約でもなんだかんだで¥2000超えてしまった。

    給与口座変更に伴い、新しいVISAデビットカードで登録を試みるが、やはり通らなかった。仕方がないので、職場の最寄りのコンビニでおさいぽ!にチャージをし、そこから支払う。 ちゃんと、お試し期間が終わってからの契約開始でよかった。

    コレまでのJUGEMブログの有料版解約もおこなおうかとも思ったけど、よくよく考えれば放置してても勝手に解約されるわけだから別にいいかな。

    って思ったけど、よくよく考えれば、これもデビットで支払いをしていたため、それまでの銀行が建て替えてしまう可能性もあり、そうなると1ヶ月分完全に不要な支払いが発生してしまうため、やはり自分でスイッチは切ったほうがいいだろうと思い、慌てて解約。

    ・本文のフォントサイズを「13.5px」に変更

    フォントサイズ(文字の大きさ)は正直このままでもいいかなとは思ってたんだけど、やはりこのブログは基本長文なので、段落間隔もこれから詰めていくとなると、ちょっと圧迫感あるかなって。まあ、見やすいのは見やすいんだけど、もうちょい小さくてもいいかな的なね。

    で、CSSに追記という形での変更のため、元サイズがいくつかは不明なんだけど「13.5px」に変更した。因みにこの「13.5px」という数字は、JUGEMのときと同じ大きさに合わせたもの。これで大分見やすくなったと思う。

    まあ、スマホについては変更は適用されないみたいなので、おそらく見た目上の変化はないと思う。 これから、過去記事の段落詰めの作業をちょっとずつやりつつ、カスタマイズもちょこちょこ進めていく所存。   ■EDIT



    久々にカスタマイズ系のネタ。

    このブログの最初期の頃に「個別記事ページにて、その記事の編集画面への直通リンクを貼りたい」というカスタマイズに関する記事を書いていたんですね。

    ※関連過去ログ

    要はこれ、読んで字の如くなんだけど、編集画面へのダイレクトリンクを貼ることで、ブログ作成者本人がブログを読み返していて、例えば誤字脱字に気づいちゃったりして、その記事をすぐさま編集したい時ってあるじゃないですか。

    そういう時にいちいちタブを切り替えて管理画面に入って、該当の記事の編集画面開いてってやるの面倒くさいじゃないですか。リーセントエントリ(直近のエントリ)だったらそれでもいいんだろうけど、たまたま結構昔のログとかだったりすると、管理者ページ内でその該当の記事探すのもダルいじゃないですか。

    けど直通リンクが貼ってあれば、管理者ページにログインしている状態で該当の記事にアクセスすれば、ブログTOPページ(或いは個別記事ページ)側からでもすぐに編集ページを開けちゃうわけですよ。コレ何気に超便利なのに、JUGEMでやってる人あまり見かけない。



    ※ぼくは「■EDIT」って文言にしてますけど、この文言も自由に設定できます。

    ↑で、コイツをクリックすると。。。



    すぐにコイツが開ける。

    で、なんでとっくの昔に紹介した内容を今あらためて書いているのかというと、実はここからが本題。

    と言うのも、このブログって「Googleアドセンス」を入れてるんですけど、Googleアドセンスって広告掲載までの審査がめちゃくちゃ厳しいことで有名なんですが、それはブログに広告掲載が出来るようになった後も続きます。ちょっとでもまずい記事があると、すぐに広告を止められます。

    「AdSense サイト運営者向けポリシー違反レポート」という件名のメールが届き、要は「違反しているページがあってそれに対して広告止めたから、詳しいことはアドセンスの管理画面でな」っていう内容。

    で管理画面見ると、こんな感じ。

    ※クリックで拡大


    来ちゃいました。このブログにも。だいぶ前にレビューした映画「マルサの女&マルサの女2」で、YouTubeにまるまる1本がそれぞれUPされていて、続きを読む以降に両方埋めたんだけど、それがまずかったみたいで。

    ※でも「クローズEXPLODE」とか「下妻物語」もまだ残っているのに、何故かこちらには言及されなかった。外国語の字幕が入っているからなのか?

    まあ、いずれにせよ、放置しててもいいことはないと思うので、すぐに対応したほうがいいに決まってるじゃないですかこんなもん。で、この「編集ページへのダイレクトリンク」ですよ。

    アドセンス管理画面から該当記事に直接飛べるので、そこでこのダイレクトリンクがあればすぐにサクッと対応できるので、まじでこーゆー時、本当に便利だなとつくづく思いました。

    因みに、指摘のあった箇所をただ修正するだけでは意味が無いので、必ず「審査をリクエスト」をクリックしましょう。 ※画像右下参照

    ■EDIT


    確か、一昨年の6月頃、リッチエディタでの改行及び行間に不具合が生じる問題が起きた。

    ※参照:
    【解決済み】<追記あり>ドラッグ&ドロップ画像アップロード実装後、発生している問題と改善について

    元々は「画像のドラッグ&ドロップによるアップロード機能」に端を発した問題だったようだけど、それについては割愛。要はそれのせいで「改行をおこなった時に、正しく改行されなかったり、行間が開きすぎたり、詰まりすぎたり、意図しない仕上がりになる」という不具合が起きていたというもの。

    実際のところ、これには僕も悩まされていて、その回避策としてぼくは、お題以外はリッチエディタの「以前のバージョン」を使うことで、この問題を回避していた。

    ※注:
    何故、お題の時はそうしなかったかというと、以前のバージョンからお題を書こうとすると、TBのURLをいちいち取得して、記事投稿時にペーストしなきゃいけなかったり、そこまでしているのに、TBが正常に送信されなかったりするエラーに度々見舞われていたためだった。

    そこで、色々調べた結果「あるタグをCSSにブッ込めばいいだけ」ということがわかり、実践してみたところ、結果として、問題が解消された。

    なので、今回はその手順についてシェアしたいと思う。 【【JUGEM】JUGEMブログのリッチエディタの改行・行間問題は、このタグで解決する。】の続きを読む ■EDIT


    久々にブログをカスタマイズ。備忘録を兼ねた、カスタマイズ日記。

    使用テンプレートは引き続き「SUPERsTANDARD (ブルー)」 何気にちょこまかと色んな所を地味にカスタマイズしてきているので、オリジナルのコピーを作っておけばよかった。もうこの人のこのテンプレート、探してもないんだよねえ。

    因みに、今回行ったカスタマイズ内容は以下の通り。

    1. 記事タイトルの文字の大きさ変更 
    2. ENTRY STATE を記事タイトル直下でも表示&項目変更
    3. フリースペース5を個別記事下部に設置 

    「続きを読む」にて順番に解説します。

    【記事タイトルの文字の大きさ変更&フリースペース5を個別記事下部に設置他】の続きを読む ■EDIT

    なぜだか急に、ふとこのブログをカスタマイズしたくなって、ちょっとだけ手を加え始めたら止まらなくなった。

    1:LATEST ENTRIESの文頭に「●」を入れる

    このブログのTOPページ左側最上段「LATEST ENTRIES(最新記事一覧)」は、記事タイトルがそのまま何のひねりもなくズラッと並ぶだけな上に、ぼくのブログの各エントリのタイトルは長いものが多いので、タイトルの切れ目が非常にわかりにくいのが、実は前々から気にはなっていた。

    で、当初「・(中黒)」を差し込もうと思ったんだけど、まんま全角で入れちゃうとSEO的にアレかと思って、リストタグを入れようかと思ったら既にリストタグ入ってやんの。

    とは言えタグは「・」付きのもののくせに「・」が入ってないから、SEO的に弱くなるかもしれないけど、ページタイトルは普通に「・」無しだから別にいっかと開き直り、どうせなら目立たせるためにと「●」にしたった。

    手順としては、HTMLソースの下記部分に差し込むだけ。

    <!-- BEGIN latest_entry_items --> <li> <a href="./?eid={latest_entry_item_id}">{latest_entry_item_title}</a>({latest_entry_item_date})


    ※上記赤丸がそれ。

    思ったほど見た目的にうるさくないと思うので、コレはこれで正解かな。

    2:引用デザイン変更

    JUGEMブログに限った話ではないけど、テンプレートによって「引用BOX」のデザインって全然違うじゃないですか。

    そういう意味じゃ、このブログで唯一気に食わなかったのがそこで、全然引用している感が薄くて。

    で、このブログはニュース記事やコラムを引用することが非常に多いので、やっぱりコレも気になってたので、よしついでにちょっと調べて簡単そうならその場でやったろか思たわけです。

    で、下記サイトに当たったんだけど、思っていた以上に簡単そう。しかも結構おしゃれ。ってことで、早速使ってみるとこんな感じ。

    ※参考サイト:CSSで作る!魅力的な引用デザインのサンプル30(blockquote) - サルワカさま
     https://saruwakakun.com/html-css/reference/blockquote

    どうよ。コレすごくいいと思う。上記サイトから気に入ったデザインのCSSを引っ張って、自分とこにブチ込んだだけ。

    3:LATEST ENTRIESの表示件数を変える

    コレすげー気になってた。多分多くのJUGEMユーザーも同じだと思う。何故Latest Entries(Recent Entries:最新記事一覧)って「5件」までしか表示してくんないんだろうかと。

    どう考えても少なすぎるし、この件数を任意で設定できないのはいくらなんでも不親切過ぎるだろう。

    で、結構ブログ初心者が勘違いしてそうなこととして「記事表示件数」の設定を変えているのに、全然表示件数増えないよ!って思っている人多いだろう。

    これは、あくまで「TOPページ上で記事を何件表示するか」という設定であって「リスト表示件数」ではないんだよね。

    で、なんとかリスト表示件数増やせないかと思って調べてみたら、この「記事表示件数」を利用した結構トリッキーなカスタマイズをしている人がいたので、試してみた。

    ※参考サイト:[JUGEMブログ] 最近の記事 {latest_entry_list} 表示件数を増やす - ちか室の手記さま
     http://latena.jugem.jp/?eid=5

    手順をソースごと書くのめんどいなあと思ったけど、参照ブログがいつ消えるかわからんし備忘録として残す価値はあると思うので、続きを読むにて記載します。

    あー。でも「NEWマーク」消えちゃったなあ。。。まあいいか。

    【【JUGEM】LATEST ENTRIESの表示件数増加&引用デザイン変更】の続きを読む ■EDIT

    いよいよ念願だった「カテゴリーのツリー化」をおこなった。

    最初、ツリー化した上で折りたたみもできるようにしようとか欲を出したせいで、ちょっとおかしなことになってしまって随分苦戦したが、ツリー化だけに絞ってみたら、別になんてことはなかった。少々長いスクリプトをコピペするだけだった。

    まあ、この処理自体は実は10年位前にFC2ブログで経験していたのだけど、当然のことながらすっかり忘れている上に、FC2は途中から、機能としてカテゴリのツリー化を用意したので、なんの苦労もなかった。

    ということで、備忘録も兼ねて、続きを読む以下にスクリプトをコピペしておきたいと思います。

    【【JUGEM】カテゴリーのツリー化をおこなった。】の続きを読む ■EDIT

    160411(月):追記
    ・個別記事ページにて、その記事の編集画面直通のリンクを貼りたい
     ⇒DONE:昼休み中にちゃちゃっと。
     ⇒クソ便利すぎワロタw



    ・個別記事ページにて、その記事の編集画面直通のリンクを貼りたい
     
    160406(水):追記
     

    ほれ見たことか。やっぱりあったわ。わざわざスクリプトで書かなきゃいけないなんておかしいと思ったんだ。  

    こっちの方が情報としても書かれた時期についても新しいのに、古い方に検索順位が負けてしまっているってのが残念でならない。  

    他の記事も見てみたところ、ブログカスタマイズにおいてかなり参考になりそうな箇所がいくつもあるので、こりゃブクマする価値は大いにあるな。  

    ってことで、Evernoteにはクリップ済み。


    ●参照・引用元
     H-FACTORYさま
     http://blog.hiiron.sunnyday.jp/?eid=5

     以下をエントリーブロック内<!-- BEGIN entry --> ~ <!-- END entry -->へ記述。

     
    <a href="./manage/?mode=write&eid={entryarea_id}">edit</a>


     別窓で開きたい場合は

     
    <a href="./manage/?mode=write&eid={entryarea_id}
    " target="_blank">edit</a> 


     「edit」の部分は好きな文言に変えればおK!  早速やってみっぺ!


    因みに青字の" target="_blank"については、別窓で開かせるかどうかを定義する命令文で、この場合「別窓で」ということになる。

    ここを削れば別タブではなく、同一タブでの「ページ遷移」という形には出来ますので、お好みでどうぞ。(個人的にはこのリンクの場合、" target="_blank"は入れない方が使いやすいです)



    ■面倒くさいからやめた■ 160405(火)
    ・個別記事ページにて、その記事の編集画面直通のリンクを貼りたい  

    今までFC2でブログやってた時は、割と簡単なHTMLを2行くらい差し込めばいいだけで超簡単だったんだけど、JUGEMの場合調べてみたら、どうやら</head>タグ直上と独自タグの部分に2つ、スクリプトをブッ込まなきゃいけないみたいでなんか面倒くせえからやめた。  

    いや、面倒くさいっていうか、別にこれはコピペすりゃいいだけだから作業工程的には面倒臭さはそんなにないんだけど、たかだか「個別記事ページにリンクを貼る」ってだけなのに、なんでわざわざ長々としたスクリプト書かなきゃいけないのかってところが納得行かない。なぜ、2行程度の記述で済ませられないのか。  

    まあ、参照したページが10年も前のブログだったりするので、ちょっとこの辺りもう一回ちゃんと調べてからやろう。 後他には「カテゴリのツリー化及び折りたたみ」とかやりたい。  

    あと、よくよく見てみるとこのブログのテンプレート、折角の3カラムなのにメニューの殆どが左側に集中してる。これじゃ3カラムの意味があまりないと思う。

    JUGEMの場合FC2と違って、管理画面上から左右のメニューの配置を気軽に入れ替えたりとか出来ないのが不便。  

    なんて言うか、エディタに関してはJUGEMの方が遥かに書きやすいし書いてて楽しいんだけど、テンプレートのデザインや、自由さとかカスタマイズ性ってことに関して言うとFC2の方がダントツで勝ってるなという印象。

    FC2にアダルト系のアフィリエイターが多い理由を改めて痛感。

    ■EDIT

    このページのトップヘ