THOR」へ変更しました。その理由は..HOME記事一覧カスタマイズストークWPテーマ「STORK」カスタマイズ!〜番外編小ネタ集5選WPテーマ「STORK」カスタマイズ!〜番外編小ネタ集5選2018年12月20日2019年11月19日ストークカスタマイズストークここあです。私はデザイナーなのでブログのデザインに関してはかなり細部にまでこだわってカスタマイズしています。これまで...私が使っているテーマ「STORK」のカスタマイズ方法に関してはかなりいろいろと書いてきました。それでもまだまだ記事として書いていない部分もたくさんあります。STORKカスタマイズ!〜番外編小ネタ集まとめSTORKをカスタマイズする時は...毎度のことながら、最初に書いておきます^^テーマをカスタマイズする時は必ずバックアップを取ってください。STORKのカスタマイズは基本的に全て「子テーマ」の方で行ってください。カスタマイズをクリック以下、追加CSSの部分にCSSコードを記述してください。私がなぜいつもCSSコードの記述先を追加CSSの部分に書くことを勧めるのかというと...ライブビューで確認しながら作業ができ非常に分かりやすいからです。CSSコードはこちらに記述することをいつもおすすめしています^^ということで...カスタマイズ方法をご紹介していきます。通常、STORKで表示される「この記事を書いた人」というのはこのように表示されますが...ちょっと存在感が薄くて残念ですよね...せっかくがんばって記事を書いてるんだから「俺が書いてるんだぜ!」ともう少し主張させてもいいのでは...と思ったりもしませんか?(笑)なので、私は枠線と背景色をちょっとだけ加えてこのようにしています。することで、存在感も視覚的なメリハリも出ます^^そもそもSTORKって...「オシャレでキレイなテーマ」と言われている割に「フッター付近が雑!」と思うのは私だけ?(笑)だから、もう少し何とかしてキレイに整えたいって思ったんですよね...^^ということで、「この記事を書いた人」に枠線や背景色をつける場合は以下のCSSコードを記述しましょう。#ccc;が枠線の種類・線幅・色になります。...1pxを2pxにすれば、線幅は太くなるし#cccを#000にすれば、黒になります。※#cccの部分は好きなカラーコードを入れてください。...solidの部分をdottedにすれば点線にdashedにすると破線になりますので試してみてくださいね。...background:#ffffe9;のカラーコード#ffffe9を変えることで背景の色が変わりますので、お好みの色を設定しましょう。背景色を黒にして、文字を白にするとちょっとだけ格好良くなります^^今回は文字色のカスタマイズ方法は、あえて記載しませんが反響があれば追記するかもしれません...。次にご紹介するのは...RECOMMEND記事を見やすくする方法です。通常、STORKで表示される「RECOMMEND記事」というのは以下のように表示されますが...文字も太くて読みにくいしそれぞれのリンクカードがくっついてて非常に分かりにくいですよね...だから、それも思い切って解消しました。こんな感じに...^^何をしたかと言うと...リンクカードの右側に細い罫線を入れて文字も細く見やすくしています。)を使ってなければさらにキレイに見やすくなります^^これと同じ設定にする場合は以下のCSSコードをコピペしてください。.ttl{text-align:justify;margin-right:7px;font-weight:normal;}}ただし、今回ご紹介するCSSコードはPC版のみのコードとしているのでスマホ版には対応してません。#ccc;の部分で罫線の種類や色、太さを変えることができます。POST記事を見やすくする方法ですがこちらも先ほどのRECOMMEND記事と全く同じです。POST記事」はこのように表示されますが...CSSコードを追加することでRECOMMEND記事と同様スッキリ見やすくすることができます。こちらのCSSコードもPC版のみとしていますが同じように変更する場合は...以下のCSSコードをコピペしてくださいね。.ttl{font-weight:normal;}}こちらも設定はお好みでどうぞ...^^検索ボックスをカスタマイズする方法お待たせしましたっ!本当にどうでもいいカスタマイズ...(笑)私のサイトは何となくWordPressテーマ「SANGO」風が可愛くていいなと思い、SANGOの雰囲気を一部取り入れているのですが...そのために行ったカスタマイズというのが検索ボックスなんですね。通常、STORKの検索ボックスはこのように非常にシンプルなデザイン。これをSANGO風にするためにCSSコードでカスタマイズしました。{background:#a7cff3;border-radius:0px;margin-top:2px;height:110%;}.fa-search::before{color:#fff;}CSSコードのカスタマイズ方法は...background:#a7cff3;のカラーコードで水色の変更color:#fff;のカラーコードで虫眼鏡の色が変更できます。いうことで、他のSTORKユーザーと差別化したい場合はぜひご活用ください!^^STORKの記事にルビを付ける方法テンプレートのカスタマイズとは少し離れますがブログを運営する場合...あまり難しい漢字などを使うと読者が記事に集中できず離脱してしまう場合があります。)で入れるのも何となく同じことを2回言ってる気がして気持ち悪いですよね...^^;そんな時に使えるのが「ルビ」の表示です。ルビさえ使えるようになれば例え難しい漢字があっても、葛藤かっとうと...このように自然な感じで読んでもらうことができます。私の場合に限って言えば...例え一般的に読みにくそうな漢字であってもひらがなで書くよりは漢字で書く方が視覚的に伝わりやすく感じる時があるのでそんな時はあえてルビを使って誰でも読めるように分かりやすい記事になるよう心がけています。ルビに関しては使う使わないに関わらずまずは「ルビを付ける方法がある」という知識だけインプットしておいて...いざ「使おう!」と思った時に私のサイトまで戻ってきてください(笑)ということで、ルビの表示方法を記載しておきます!ルビのHTMLコード<ruby>葛藤<rt>かっとう</rt></ruby>ルビを表示させたい場合は<ruby>と</ruby>の中にルビを表示させたい漢字を入れてさらに<rt>と</rt>の間にルビとなる「ふりがな」を入力します。ルビの表示方法は一見難しいそうに見えますが分かってしまうと実は意外と簡単なんですね...。私は漢字とルビの位置がちょうど良いところに来るようにCSSコードで位置調整もしています。1ex;}CSSコードの解説はあえて致しませんが...(笑)ルビを使ってみようと思う場合はHTMLコードの書き方を覚えつつCSSコードも追加CSSにコピペしてくださいね。STORKカスタマイズ!〜番外編小ネタ集まとめ今回はあまり必要性のないマニアックなカスタマイズ記事をあえてご紹介致しました^^しかし、私が思うに...これは必要じゃないかも...これは当たり前のようにみんな知っているだろうということでも実は意外とそうでもなかったりする場合があるんですね。記事を書く時は検索数の見込みが全くない記事をただ一生懸命書いても無駄にしかなりませんが仮にそうでない場合は、とりあえず記事を書いてみても良いかな...と私は思っています。ネットの場合はアクセス解析というカタチでデータ分析することもできるしある意味それが、ネットを使うことの強みなのでちゃんと分析さえすれば、どんな記事も無駄になるようなことは決してありません。気になったことをとりあえず記事にしてみると「これって意外と需要あるかも?」なんて新たな発見ができることもあったりします。いずれにしても記事を書く時は...何かしら差別化をしていかないと「この人の書いてる記事全然つまんない」とか「全く役に立たない」と思われるただの悲しいブログになってしまいます^^;なので、需要があるかないか分からない内容でも他の人と切り口を変えてまずは自分が楽しんで書くことで...「この人の記事なんか面白い」と思ってもらえる可能性も高くなるしそうすることで少しずつファンを増やすこともできるようになってきます。しても書く事が見つからないという時は...※私はそんなことないですよ...^^あなたが「当たり前だ」と思っていることや「まぁ、書くだけ無駄かな?」と思うようなことでもとりあえず書いてみましょう!(笑)なにげない記事でもあなたの個性がちゃんと出れば記事としては十分に生きます^^なので、あなたの個性も大事にしましょう!正直、機械が書いたような心のない記事Wikipediaのような情報を載せただけの記事ではあなたにファンがつくことがありません。今回はある意味、私にとっては本当に試験的に書いたようなものですが...それでも「良かった」と思ってくれる読者がいれば私にとっては嬉しいし、書いてみて良かったと思える時もくるんじゃないかな?と信じています^^だからこそ、わたしはこんなマニアックなカスタマイズ方法でも書くことに意味があると思っているので...これまで放置しながら温めていたネタを書きました。記事を書く以上は1人でも多くの方に「役に立った」と思われる方が嬉しいので...適当なことを書いたつもりはありません。いつもいつも「読者に役立つ記事は何だろう?」とそればかり気にして書いていたら正直、私はものスゴくしんどいしブログを書くのも全然楽しくなくなるので...たまには1つぐらい自分が書きたい記事を自由に書いてもいいんじゃないか...と思って今回のような記事を書いたワケです。話がそれてしまいましたが...そんな私の想いも一緒に感じてもらえると嬉しいです^^実は今回一番お伝えしたかったのはそこなんですけどね...(笑)カスタマイズはどうでもいいんかいっ!一見カスタマイズ記事紹介のように書いてますが...実は要点がそこじゃないというのもブログ運営の楽しさです...。一流の開発陣によって集客と収益に徹底的にこだわり開発された究極のテーマ「ザ・トール」。どのテーマよりも早く実装された革新的機能が詰まったこのテーマで、あなたもインターネットを活用したビジネスを始めませんか?詳しくはこちら前へ2018年12月19日WPテーマ「STORK」の吹き出しをカスタマイズする方法!次へ2019年2月10日AFFINGER5カスタマイズ!3列フッターを美しく整える方法!この記事を書いた人ここあデザイン制作プロダクションを転々としながら、20年間勤務して2017年に独立。現在はネットとグラフィックデザインのスキルを活かし幅広い分野で活動中。己を磨き誠実に対応すれば、仕事や人脈、そして人生までも大きく変えることができる「ネットビジネスの素晴らしさ」、そして会社に頼らず「自分らしく生きる方法」をこのブログを通じて発信しています。詳しいプロフィールはこちら人脈が成功への最短ルート!私がMonologueを勧める理由WordPress設置代行始めました!※設置代行はメルマガ読者限定です。THORSTORKここあデザイン制作プロダクションを転々としながら、20年間勤務して2017年に独立。現在はネットとグラフィックデザインのスキルを活かし幅広い分野で活動中。己を磨き誠実に対応すれば、仕事や人脈、そして人生までも大きく変えることができる「ネットビジネスの素晴らしさ」、そして会社に頼らず「自分らしく生きる方法」をこのブログを通じて発信しています。●20年サラリーマンをしてきてなぜ今になって脱サラしたのか?●安定を求めれば求めるほど不安定になる理由とは?●いくら知識があっても、あなたが絶対に成功できない理由など、無料メール講座本編では、決して表には出せない秘匿性の高い情報もたくさん提供していきます。※この無料メール講座は、私が有料セミナーで直接成功者たちから聞いた内容も多数含まれているため、予告なく募集を終了する可能性があります。印刷会社と取引がある制作プロダクションで様々な経験や実績を積み、2017年に独立。現在は、グラフィックデザインを生かしたWebデザインのビジネスを展開しながら、ネットを生かした情婦発信を行い、新しい働き方や楽しい人生の過ごし方についてもお伝えしています。