素人でもイケる!部長ナビのページ・Simplicityカスタマイズ「やってること」まとめ(2016年9月17日更新)

simplicity_logo

こんにちは。WordPressテーマ「Simplicity」大好きの部長ナビ(@nabi_1080)です。日々カスタマイズ頑張っております!

部長ナビのページは月間415万PVの「gori.me」著者のg.O.R.iさんから、オフィシャルファンサイト認定を受けております。ブログデザインについても、多くの部分をgori.meから採用させていただきまして、Simplicityバージョンとして実装しております。許可を得ておりますので、ご安心ください。「公認パクりサイト」でございます。g.O.R.iさん、いつもありがとうございます!

さて、当ブログはSimplicityをかなりカスタマイズしていますが、何をしているのかをまとめて記事にすることにしました。備忘録の意味もあります。上に行くほど、新しいカスタマイズになりますので、変更があった場合、上の方が優先されるカスタマイズになります

なお、2016年8月からは、カスタマイズを全て私が自分でやってます。コード歴1ヶ月でもイケちゃうSimplicity、たくさんのブロガーのコード公開記事のおかげでございます。ありがとうございます

ただ、当ブログのカスタマイズコードについては、諸事情ありまして(ちょっと色々なトラブルが絶えなくて・・・)、記事として公開するのを控えさせていただくこととなりましたのでご了承ください。今後、記事としてコードは公開しません。

スポンサーリンク

2016年9月17日

IMG_4742

わかりますか?

細かいんですが、「スライドインメニュー」をやめました。右上に「三本線の箱」がありますよね?コレがデフォルトのメニューでして、ここタップすると、グイーンとグローバルメニューが出てきます。

で、問題は、PCです。PC表示はタイトルロゴ横にgori.me風のメニュー一覧ボックスを置いているので、PCはグローバルメニューを非表示にする必要があります。これもググれば簡単に出てきたのですぐにできました。イヤー、hidekichiさん、マジで神だな。わいひらさんもいつもお陰様です!

IMG_4739

モバイル表示をいじりました

スライドインメニューをやめたので、サイドバーが記事の下に来るんですけど、ツイートを上にして、その下にLINE@の友達登録、そして、ランキングにしました

あと、右下に「トップに戻る」ボタンがあるのが見えると思いますが、これ、わかります?一番下に広告が入っていますよね?その上に移動させたんですよ。それまではかぶってました

コレ、位置調整可能でした。イエーイ

IMG_4740

そして、最下部

ランキングの下には「部長オススメ記事」「プロフィール」が来ていたんですが、コレ削除して、記事一覧と、ツイート、LINE@友達登録、ランキングだけにしました。後はフッターで自己紹介、ブログ紹介、問い合わせ、カテゴリ一覧入れてるので、まあ、コレで良いかな的な感じです

最近よく参考にさせていただいているのが、gori.meは当然ですが、男子ハック、気になる、記になる・・・、あかめ女子のWebメモと大御所のブロガーの皆さんのデザインを見て、「なるほどー、こうすれば良いのかー」と言った感じで取り入れ、カスタマイズさせていただいております。ありがとうございます。勝手に参考にして申し訳ありません

モバイル、結構悩んでたんですが、サイドバーをうまく工夫すると、Simplicityもスッキリした表示になります(基本、サイドバーが、記事一覧の下に全表示なので、PC用テキストボックスをうまく使って処理しました)。PC表示は何も変わってません。グローバルメニューを非表示にしただけですね。モバイルのてこ入れをしました!

2016年9月15日

【WordPress】SNS Count CacheのFacebook取得できない問題に終止符か?今すぐ「mbdb」に行け!
【WordPress】SNS Count CacheのFacebook取得できない問題に終止符か?今すぐ「mbdb」に行け!
こんにちは。部長ナビ(@nabi_1080)です WordPressの話題です SNS Count Cacheで、Facebookのシェア...

↑この記事で、SNS Count CacheがFacebookのシェア数取得に対応するコードを公開していると書きました

で、僕もそれを取り入れたんですけど、常連さんから「Apple Watch Series 2 Nike+モデルの記事をシェアしたのに、カウントが増えない」という情報が入りまして、管理画面で見てみたら「N/A」になってました。ええ、カウントされてませんでした

こういうこともありますし、「20シェア行った、わーいわーい」ってことも最近無くなってきたので、シェア数は外すことにしました

この間、せっかくカッコよくよーた師匠のデザインを取り入れたんですけど、スイマセン・・・。常連さんも「正しくシェア数が表示されてない」のが気持ち悪いみたいなので、やっぱり「シェアするからには、数字が増えて欲しい」と思っていただいている嬉しい感想もありますので、数字を気にせず、今後はシェアしていただけるようにカウントを外しました

まあ、9月1日前にカテゴリ階層を大幅に変えてますので、ほぼ全ての記事のシェアが0ですから、あまりシェア数表示は意味を持たないんですけど・・・

今回の「やっぱり取得されてなかった」という件を踏まえ、より、読者の皆様に分かりやすく、見やすい記事ページにしてイケればと思いました

精神的にも、僕のPVって結構微妙なところがあるので、チキン野郎の僕にとって「数字がでている」ってのはちょくちょく見に行って一喜一憂したりするんですよ

だから、逆に無い方が良いという結論に達しました。ご了承ください

また、カテゴリ階層、変える予定ですけど、チョコチョコ階層変えていきます

わかってる方も多いと思いますが、手本はgori.meです。完全にパクってます(笑)。g.O.R.iさんに言ったら「知ってます」って言われました(笑)。いつもスイマセン・・・。

この間、お世話になっているお礼に盛岡三大麺セット送ったので、今度は、また、美味しい岩手の名産品(いちご煮なんかg.O.R.iさん食べたこと無いだろうなぁ)を送りたいと思います。三陸海宝漬けも良いよね。とにかく、パクりまくっているので(笑)、いくら許可をいただいて、その都度お礼を言っていると言っても、やっぱり、モノを送るって、大事ですよね。うん。大事。

ちょっとショップに問い合わせてみて、コラボ企画で宣伝してみようかしら。メール発射してみますね!

っつーワケで、シェア数変更でございます。

スクリーンショット 2016-09-15 04.24.58

↑関連カテゴリのカテゴリ名を太字にしました。見やすくなって良いよねぇ。フォントサイズも調整、アイキャッチもちゃんと縮尺が大丈夫になってますね。イエース

2016年9月11日

総シェア表示の文言を変更。要望の非常に多かったPocketボタンを追加

スクリーンショット 2016-09-11 02.33.32

「Total ○○ Shares」から「Thanks ○○ Shares」に変更しました。やっぱりシェアって「ありがとう」かなーと思って。

あと、Pocket追加しました。はてブとGoogle+は追加の予定は無いです。ご了承ください(Chromeのプラグインでイケます)

トップページ、PC版ヘッダー下の「主要カテゴリ新着記事一覧」のサムネイルが潰れていた(縮尺がおかしかった)のをやっと修正。「通常レビュー」を外し、Apple製品だけで表示(gori.meに準じた)

直ったと思ってたら直って無くて、カメ仙人に言われて発覚

昨日、作業しました所、ウマく行きましたね

スクリーンショット 2016-09-11 02.34.00

gori.meは「iPhone」「iPad」「Mac」「Watch」「Apple」ですので、ウチとは違います。ウチは「Apple」がありませんし、MacBookを2つにわけてます

さらに、「最新記事」が入っているのもウチだけです。コレ、過去にはgori.meも「最新記事」ってあったんですけど、カテゴリ最新記事は多分読者の混乱を招くかと言うことで外されたんだと思います

ウチはヘッダー下の目立つところに、コレ置いてるので、誰が見ても最新記事ですから、まあ、問題無いかなと思って「最新記事」という文字を入れています

通常レビュー、それほどアクセス無いので、外しました。やっぱり、Apple製品は何だかんだでシェアされますね。Apple Watch復活です。昨日のこの記事、スゲー反響ありました。Apple強いよなぁと思いましたね

記事下の「関連するカテゴリ」のサムネイルサイズを縮小、文字サイズ、太字、表の縦幅調整

スクリーンショット 2016-09-11 01.46.53

コレ見れば分かりますけど、今まで「関連するカテゴリ」のアイキャッチが大きかったんですよ。だから、色々調べて、さっき直せました。コードいじりましたけど、まあ何とかなるもんですね

あと、ついでに、gori.meに習って、文字をやや大きく、そして、太字にしました。今までは文字が大きすぎて、モバイルで見づらいという話が結構読者からでていたので、style.cssで場所突き止めて、修正しました。

下の「関連記事」と比べるとアイキャッチが小さく、見やすくなったのが分かると思います

ちなみに、この関連カテゴリの表時は「ディスクリプション」を表示することもできますが、僕はカテゴリタイトルだけを表示しています。だって「関連するカテゴリ」だからね。カテゴリ名だけの方がスッキリするかと思ってそうしてました。

実際、Google Analyticsを見ると、アクセスはかなりあります。カテゴリページ。回遊率アップに最適のカスタマイズfeat gori.meでございます。

2016年9月6日

毎日コロコロデザインが変わる当ブログですが、良い意味で試行錯誤、前進と言ってください

今回も読者の方からの要望でしたが、「シェアするときに、数字として反映されるのは、読者としては嬉しいので、トータルシェアだけでも良いので小さく表示してもらえないか?」という意見や「Google+に最近記事更新通知が来なくなったが、フォロワーが少なくても、ファンがいるので、ぜひ通知を出して欲しい。シェアもたまにだがしているのでお願いできないか?」という意見がありました。

調べてみたところ、はてブも、Google+もChromeの拡張機能がすぐに出てきましたので、コレで更新情報を流すことができます。Pocketのボタンも、実は要望が多くて、どうしようかと思っていましたが、あれ、地味にめんどくさいのでちょっと待ってくださいね。Google+や、はてブって「シェアされました」って通知を見たことが無いので、多分皆さん、ご自分で拡張機能等を使ってシェアしていただいてますよね?どうなんですかね?そこがよくわからないんですよね。はてブのボタンも欲しいって言われることは言われます。でも要望が多いのはPocketですよね。読んでみて「また読みたい」って方が気軽に登録できるPocket。うーん、33%位に小さくして、シェアボタン作るか?僕はChromeの拡張機能でガンガン登録してるので、無くても大丈夫なんですけど、思ったより要望が多いのでちょっと考えてました。はてブもGoogle+も要望はありますけど、圧倒的にシェアされるのはPocketなんですよね。Twitter、Facebook、Pocketがあれば良いかな?って個人的には思ってますけど、ボタン3個ってのがちょっと引っかかるんですよねぇ。5個なら良いんだけどゴチャゴチャしてるし、4個がベストだけど、うーん、どうすっかな。

一応、僕は読者の皆さんの要望をある程度取り入れてデザインを作っていくというスタイルを取っているので、自分で「こうしたい」ってのもありますけど、今やってるのは細かいところなんですよね。だから、僕的にはぶっちゃけるとどっちでも良い。だから、常連さんを中心に意見を聞いて、決めていきたいですけど、ボタンは増やす方向かなーと思いました

Youta CH(よーたチャンネル)のシェア数表示がマジカッコいい
https://youtachannel.com/

↑Twitterでアクティビティをしてくださるよーたさんのブログ「Youta CH」ですけど、この方、高校生なんですね。スゴいなー

ちょくちょく覗いているんですが、最近、「総シェア表示、カッコいいなぁ」とずっと思っていました

で、上にある通り、常連さんからの「シェア数が反映されると嬉しい」という声があって、それならと、feat Youta CHでオイラも作ってみたよ。段々コードも慣れてきて、10分くらいでできた

スクリーンショット 2016-09-06 02.13.28

ほら、できたでしょ?

やっぱり、Pocketのボタン、付けるかなー

ちょっとしばらくコレで様子見ます。なお、シェア数はほとんどの記事が「0」です。最近の記事と、教育系、グルメ系、家族系だけ、カテゴリ階層をいじってませんので、シェアは残ってます。上のシェアは天下一品盛岡店の記事ですね。これくらいのシェアが何本かあったんですが、全て0になりました。また1から頑張ります

では、Pocketのボタンをちょっと付けて、ボタン3個にしてみますね。お待ちくだされー

2016年9月5日(2回目)

スイマセン・・・。トップページだけ、シェア数表示しましたが、まず、モバイルのトップページが激重になりました

そして、PCも重くなる始末・・・

常連さんからも即反応があり、昼には大変なことになってました

「重くなってまで、シェアを表示する価値があるんでしょうか?」というグサッと刺さるアドバイスもあり、g.O.R.iさんにも相談してシェア数は外すことにしました。ま、仕方ねえか・・・

あと、結構いわれたのが「1日1万PV行ってるのであれば、私のように常連もたくさん付くはずです。常連はシェア数見ませんから、ぶちょーさんは記事が面白いので、常連のことを考えて、シェア数はいらないのでは無いでしょうか?サンプルレビューのためというのはわかりますが・・・」というお話

9月というか、8月真ん中あたりから普通に1日1万PV超えるようになってきました。8月下旬からは連続で超えまくってます。確かに、常連さんのことを考えると、シェア数よりも、表示速度や、記事を書く時間にもっとブロガーとしての時間を使った方が良いかもしれませんよね

表示速度は、色々やればやるほど遅くなると思っているので、逆に削る方向で色々とカスタマイズしていこうかと思ってました。究極に軽いブログ。でも、見やすい、また来たくなるブログ

色々とゴチャゴチャした表示は常連さんも希望していないことも、シェア数の表示がそれほど意味がないこともよくわかりました。っつーか、確かにシェア数って誰が見るんですかね・・・。今日聞いた20名を超える常連さんは一人もシェア数見てないそうです。マジかよ。俺だけかよ!シェア数気にしてるの!

とにかく、軽く、スッキリしたトップページ、記事ページを目指そうと思います。ウチには、サイト構築のプロがいますし、プロカメラマン、セキュリティのプロもいますので、スタッフと相談しながら良いブログ作りをしていきたいですねー

っつーわけで、スイマセンでした!元に戻しましたが、タイルっぽいエントリーカードはそのままです!何かあれば要望メッセージ待ってます!シクヨロ!

2016年9月5日

トップページの記事一覧と、カテゴリページからの記事一覧のエントリーカードに「Twitter、Facebook、Pocket」のシェア数を載せました

モバイルもウマく行き、良い感じですが、当然有名サイトを参考に作ってますので、今、著者の方に問い合わせをして参考にさせていただいて良いかの返事待ちです。ダメなときは今まで通りシェア数の表示は削除します

記事ページについては、結構色々意見があったのと、アドバイスいただいたいってのがあって、一切シェア数は出さないことにしてます。でも、最初の一覧ページは、2〜3日くらいのシェア数が見れるので、僕の確認にもなるかと思って採用してみました

シェア数がオール0の記事と、いくつかカウントされてる記事の違い

シェア数がオール0の記事(もしくは1だけとか)は、「カテゴリを変更しURLが変わってる」ことになります。昨日か、一昨日で、ブログ管理のURLを全て変えましたので、昨日更新したモノ以外は全てシェア0です。基本的に変えてないのは「教育関連」と「家族関連」だけなので、主要なApple製品、レビュー、BOSE製品等は全てカテゴリを変え、URLが変わり、そして、シェアがオール0になってます

だから、記事個別ページではシェアを表示しないんですね。サイト内検索はGoogleカスタム検索なので、シェア数は当然出ません。記事一覧と、カテゴリページからの一覧だけシェアがでます

まあ、要するにボク用です。僕の確認のためにシェア数を出してる感じですね。800を超えていた記事もほぼ全てシェア0になりました。また1から頑張ります!

ちなみに、この記事も結構シェアされてましたが、昨日か一昨日の作業でシェアが0に戻りました。まあ、別に良いです。またシェアしてね!

2016年9月3日

エントリーカード、ブログカード、関連記事において、「全リンク化」を行いました

これは、今まで手を付けていなかったのは、全リンク化をすると、今まで設定した背景色とか、文字の大きさ、行間が全てリセットされてしまうためで、どこで直せば良いのかわからなかったのでそのままにしてましたが、逆に、関連記事等を全リンク化する仮定で、段々色々とコードの背景が見えてきたこともあり、思い切ってカスタマイザーから「全リンク化」をして、その後、コードをいじってみたら、ウマく行ったというわけですね

背景色が、黄色くなるのはgori.meと同じです。選択時は全てこの色で統一しています

やっぱり、トップページのエントリーカードも全リンク化すると押しやすくなりますよね

Simplicityの良いところは、「わいひらさん(作者)がある程度先回りして、カスタマイズをしてくれている」ので、コードがすでにある状態で、我々素人でも「class名を探せば」イケちゃうってことなんです。

実際、今年の8月からコードを本格的に触った僕でも結構色々カスタマイズできちゃってますので、ぜひ、皆さんもやってみてくださいね。全リンク化は、読者視点で考えると非常に良いと思いますし、gori.meも基本的に全リンク化ですよね。Simplicityもその機能がありますので、それをオンにした上で、枠線や背景色、カーソル合わせた時の色、フォント、行間をいじると良い感じで仕上がります。お試しあれ!

2016年8月24日

スクリーンショット 2016-08-24 04.52.27

とうとう、「シェアボタン設置難民」状態が解決しました!イエーイ!

アドバイスをいただきまして、納得してこの形となりました。理由、理論があります。スゴいです。マジで

で、お気づきの方も多くいらっしゃるんですが、このシェアボタンを「2つ」だけ「記事下」という配置は、gori.meと同じです

スクリーンショット 2016-08-24 04.54.17

↑コレ、gori.meのスクショ

左右は違うけど、2つ並べて記事下ってのが結果的に同じになりました。当然、g.O.R.iさんには報告済ですので、ご安心ください

なぜ2つだけなのか、他のシェアボタンは不要なのか、上になくても良いのか、シェア数はなぜ表示しないのかは、アドバイスいただいての決定なので、お答えできません。ご了承ください。すでにブロガーの皆さんから、多くの質問をいただいておりますが、返信で同じことを書くのが大変なので、この記事を持って回答とさせていただきます

コレで、シェアボタンは決まりました。決定です

シェア数を表示しないことで決まったので、シェア数が関係なくなりました。よって、今朝から少しずつ進めているんですが、「カテゴリ階層」を組み直して、リダイレクトをかける作業を行っています。コレも常連さんから教えていただいて、ひこP監修の元、間違いのないように進めておりますが、初めてなので、少しずつやってます

簡単に言うと、「カテゴリがゴチャゴチャしてるので、もっと見やすく、あのブログ(某師匠)みたいにスッキリとしたカテゴリ構成にしたいので、記事URLが変わるよ」ってヤツです

記事URLが変わると(ウチのパーマネントリンク設定にカテゴリ名が入っているので、カテゴリの改造を行うと、自動で記事のURLが変わる)シェア数がリセットされるということになるので、今まで「シェア数を表示していた」ので、カテゴリ整理を我慢して、やたら長かったり「このカテゴリ、ここじゃねえんだよな」って思いながら変なカテゴリを変な場所に作ったり、もう、とにかくカオスでした。気持ち悪かったんですが、今回のシェアボタン問題解決に伴い、思い切ってカテゴリ階層を変えていくことに決めました。

本格的な階層変更は、9〜10月の2ヶ月を使って、チマチマやっていきたいと思ってます。9月は新製品の発表があるので、該当記事の所属するカテゴリを優先して新しいカテゴリ階層にして、見やすく分かりやすいカテゴリ構成にするつもりです

あと1週間で、8月も終わりますので、8月中に、リダイレクトのことをしっかり学んで、間違いのないように、リダイレクトさせたいと思います。詳細は後で記事にするかも知れません。

今後もパーマネントリンクにカテゴリ名は入れていきますので、まあ、チームgori.meなので、頑張って「URLもカッコいいブログ」にしたいですね!

シェアボタンについては多くのご意見、ご要望、ありがとうございました。最終的に、今の形で決定となりましたので、今後、変更することは多分無いです

なお、シェアボタンが上にないと言うことで、シェアしづらいという場合はChromeの拡張機能等をお使いいただくと、記事途中でもシェア可能です

僕はTwitterは「twitshot」のChrome拡張機能、もしくは、Tweetbot 4で直にツイートしてます(ブックマークレット)。Facebookは、Chrome拡張機能で公式のものがあるので「Share to Facebook」で拡張機能を検索するとChromeに実装できますので、お試し下さい

Chrome拡張機能「Facebook公式シェアボタン」が最高に使えるぜ!
Chrome拡張機能「Facebook公式シェアボタン」が最高に使えるぜ!
こんにちは。部長ナビ(@nabi_1080)です Facebookは、最近はMessengerも含め、一番使っているSNSだと...

↑Facebookの公式シェアボタンはこちらからどうぞ!

2016年8月23日

スクリーンショット 2016-08-23 05.32.58

シェアボタンを変えました

4つカスタマイズ、変更を行いました

1 シェア数を入れて欲しいという要望が多く、個別シェアを採用した

コレ、実はかなりたくさんありまして、記事を読む時の目安にしたいとか、ブロガーの方から、どの記事を参考にするか目安になるので、表示して欲しいという要望がかなりありました。ただ、総シェアは、デザインが崩れると言うか、元に戻るので、このボタンのまま行きたかったので、総シェアをやめて、個別シェアになりました

2 SNS Count Cacheのカウントをやめ、Simplicity独自のカウント取得にした

SNS Count Cacheは、記事に出した通り、Facebookへの対応がなされていますが、再取得に時間がかかります。ウチのブログは記事数が5000を超えるので(コレでも4000以上削除したんだけどね)とってもじゃないけどやってられなくて、Simplicityのアップデートが迅速であるのと、即シェア数を取得できるので、こっちにしました

ちなみに、feedlyもSimplicityカウントにしましたが、朝の時点で0ですね。まあ、feedlyは日中じゃ無いと正しいカウント数が出ないので理由はわかりませんが、そういうことだと思って待ちます

3 Google+を外した

現在、gori.meは、シェアボタンがTweetとFacebookシェアの2個しかありません。で、ウチも、最初は、5個のボタンを並べていたんですけど、Google+って、驚くほどシェアされないんですよ。フォロワーもメチャクチャ少ないので、無理してボタン作る必要も無いかなと思ってやめました。コレは、g.O.R.iさんと相談して決めました。ガンガン少なくする方向で考えてます

4 上下2カ所にシェアボタン→下だけ→上下2カ所に復活

昨夜見た方は「シェアボタンが下にしかない」と言うことに気付いたと思いますが、テストで上のシェアボタンを外しました

しかし、起きてみると多くの方から「上にもシェアボタンが無いと、なんか気持ち悪い」という、今の配置に慣れてしまっているということで、変えないで欲しい、後は、シェア数がすぐわかるので、上にもボタンが欲しいという意見がかなり多くて、元に戻しました

僕的には上下あった方が良いと思いますが、現在、多くのプロブロガーの方はシェアボタンは下だけです。でも、僕は上も付けたい。みんなもそう言ってるということで、上、復活です

ほかにも、関連記事の行間をちょっと変えたり、細かいカスタマイズをしましたが、まあ、概ねウマく行きました。良かったッス

コレで、一段落かなぁと思いますけど、また何かあれば報告します

2016年8月22日

image

↑左が、一昨日の作業、右が昨日の作業です(iPhone 6s Plus)

見ての通り、シェアボタンの横幅をiPhone 6s Plusに最適化しまして条件分岐をモバイルで3つにしました。で、ロゴマークを大きくしました

また、PCは予想通り、常連さんから「シェアボタンセンタリングしてー」って話が出たので、センタリングしました。今はセンタリングされてます。数ミリなんですけどね。まあ、良い感じです

コレで一段落かなーって気はしてますが、また、カスタマイズしたらお知らせしますね!

2016年8月21日

スクリーンショット 2016-08-21 05.17.59

↑シェアボタンを変更し、総シェアを取りました

Facebookの、「いいね」「シェア」数がカウントできなくなっているので、カテゴリの再配置を真剣に考えてみた(シェア数リセットされるけど)〜シェア数って誰のため?〜
Facebookの、「いいね」「シェア」数がカウントできなくなっているので、カテゴリの再配置を真剣に考えてみた(シェア数リセットされるけど)〜シェア数って誰のため?〜
(image via ぱくたそ・にゃるるさん) こんにちは。部長ナビ(@nabi_1080)です 昨日、一昨日あたりから、Facebook...

↑経緯はこちらから

なお、ボタンのデザインは、旧gori.meです。g.O.R.iさんには報告してあります。文言が完全にgori.meとおなじ(はず)です。記憶をたどりながらこうなりました。現在は、gori.meでは「Tweet」と「Share」の2個のボタンしかありません。はてブ、Google+、Pocketは無くなりました。ウチはボタン無くすと「あった方が良いです〜」というネット初級者の方の声が結構あるので、この5個で行きます

「PCだけセンタリングしないんですね」というナイスなご指摘いただきましたが、その通り、PCだけセンタリングしてません。別に良いかなと思って(笑)

たけPに指摘されたら作業しますが、多分、このままでしょうねぇ。たぶん・・・

image

↑モバイルでは、5sと、6s、6s Plusの2つのグループに分け、条件分岐でシェアボタンの横幅を変えました。4インチだけ横幅が一杯になってるはずです

上の画像は僕のiPhone 6s Plusなので、5.5インチの表示です。4.7インチに合わせてるので、横幅一杯になってませんが、ま、良いかなってことで、モバイルはコレで基本行きます

「いや、Plusは横幅一杯にしてくれ」って言われたら、作業しますが、どうですかね?条件分岐、全然難しくないので、サクッとできますがいかがしますか?

ちなみに、このモバイルのシェアボタンについては、常連さんから「縦幅」について、かなりの注文をいただきまして、微調整を重ね、この幅に落ち着きました

これ以上狭くすることはありませんが、「もっと縦長にして欲しい」という要望がありましたらどうぞ。PC同様に、総シェアは取ってあります

image

PCもそうですが、記事下の「フォローボタン」は取りました。誰も押さないのと、記事下にフォローボックスがあるので、別にいらねえかと思って取りました

スッキリして良い感じだと思います。これは、iPhone 6s Plusの表示ですけど、良い感じでまとまってますよね。iPhone 6s Plus、やっぱりいいよなあ・・・

2016年8月20日

スクリーンショット 2016-08-20 06.15.31

↑ブログカードは、全リンク化を目指しましたが、ググると結構大変だと言う事が分かったので、とりあえず「外部ブログカード」(下のgori.meのヤツがそうですね)を、今までの「はてなカード」から「Simplicity独自の外部ブログカード」に変更した上で、表示のカスタマイズを行いました

色々頑張ったんだけど、本文抜粋を取ろうとして「content」を「display:none」にすると、タイトルまで消えて、「snippet」を「display:none」にすると、何も消えないという鬼仕様のため、ムーン、って感じですね。ま、でも良いか。内部リンクと外部リンクの色を変えたから、良い感じでしょ?

外部リンクって、日付が出ないんだね。ま、外部リンクだからいいのか

スクリーンショット 2016-08-20 06.15.59

はい、コレ、ずっとやりたかったことです

Simplicityだと、「エントリーカードを全リンク化」という項目ができまして、aタグを外して、新しいタグがくっつくという仕様になっていましたが、それを突き止め、このチェックを入れなくても、自力で全リンク化をするということに成功しました。今までは、上のアイキャッチ画像を選択しても、下のタイトルは黄色が付かなかったんですが、左上見てください。見事に黄色が付いてます。なお、タイトル部分にカーソル合わせると、タイトルが赤くなるので、この画像が「上のアイキャッチにカーソル合わせて、下のタイトル部分にも色が付いている」という証拠になります。まあ、コードわかる人には何でも無いことかも知れませんが、WordPress始めて1年も経ってない、コードをちゃんとやり始めてから3週間(2016年8月から自分でやるようにした)の私でも出来たってのがデカいんです

皆さん、Simplicity、頑張って親テーマ調べて、どのclass名で何が行われているか調査し、それを、子テーマのstyle.cssで色々いじると思ったより良い感じで自分の好みのデザインになります

イエーイ

ぜひやってみてねー。あ、ちなみに、コレだけで、今日で3時間かかりました。もう、このカスタマイズ10日以上やってるので、20時間以上、コレだけでかかってます。でも、自力でいけます。頑張りましょう!

2016年8月19日

スクリーンショット 2016-08-19 19.08.05

・PCのいいねボックス下のフォローボタンを4分割にして、YouTube登録を追加

image

・モバイルは、4列入らないので、2段、2列にして、YouTubeのチャンネル登録ボタンを設置(4インチモバイルでも表示崩れが無いことを確認)

・モバイルの主要カテゴリリンク(iPhone、iPad、Mac、長期連載、カテゴリ一覧)を横幅をある程度揃えた

良い感じでできましたね。もちろん、自分でやりましたので、素人でも頑張れば何とかなります!ググりながら頑張りましょう!

2016年8月17日(これ以前のカスタマイズで紹介していないものも含む)

・PCの、関連記事のサムネイル縦横比がおかしかったので、正方形に修正し、センタリング。枠の上下幅変更

・PCの、ヘッダー下「主要カテゴリ最新記事一覧」のサムネイルの縦横比がおかしかったので、修正し、現在は正式な(歪んでない)アイキャッチを表示

・PCタイトルロゴ右主要カテゴリメニュー表の高さを微調整

・モバイルの関連記事も、サムネイルの縦横比がおかしかったので(機種、縦、横置きにより、gori.meのロゴ(正円)が歪む現象が起きていた)、正方形に全て修正し、センタリング。枠の上下幅変更

・モバイルの関連記事表示を、大型スマホ、小型スマホ、スマホ横(iPad未満)の3つの条件分岐で指定を変え、iPhone 5sを横にした時のおかしい表示を修正

・モバイルのサイドメニュー、ロゴがGoogle+のバナーだったのを、ただの犬ロゴに変更

・モバイルで、【 】で囲まれていたリンクの【 】を削除

こんな感じですね

最初なので、多めに書きましたが、1日でコレ全部やってるわけじゃないです。毎日何かしらカスタマイズしてます

関連記事は、左右に余白ができましたが、サムネイルがどうしても納得いかなくて、正方形に無理矢理変えました。そしたら、良い感じになったので良しとします

問い合わせが多く、この記事で紹介しているカスタマイズ以降のモノはコードを公開していませんと言うお知らせをするのが大変なので、記事にしてまとめることにしました

Simplicityは、かなり色々カスタマイズができますので、調べてやってみる価値は十分にあると思います。僕は素人ですが、素人でも色々調べて、試行錯誤するとイケますので、とりあえずググって、失敗しながらでも良いのでコードを色々いじってみましょう!

1ヶ月に1回くらいは更新したいと思いますので、カスタマイズが無ければ更新しませんけど、ブロガーの方はもちろん、一般の読者の方でも「ここをもう少しこうして欲しい」というご要望がありましたら、最終的にはスタッフ会議で決めますので、全部通ることはありませんがご意見は頂戴したいと思っていますので、お気軽にお問い合わせください

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

この記事の関連カテゴリ

サイト内検索