目次 カスタム cocoon 4

ちなみにtopの数値を大きくすると、吹き出し部分の線が細くなり、小さくすると太くなります。, いかがだったでしょうか？ 注意する個所は、【.article h2::after】にある【top】の数値です。, こちらでは吹き出し部分の線の太さを調整しています。 やろうやろうとずっと思っていたのが、コードを表示させるときに使うハイライト機能に関するカスタマイズです。 ... 久々のカスタマイズです。 まず、管理者画面の左側のサイドバーに「Cocoon 設定」が存在するので、それを押してCocoonの設定画面に入ろう。 そして、上の切り替えタブを見て行くと、「本文」と「SNSシェア」の間に「 目次 」と書かれているタブがあるはずだ。 cocoonの目次デザインをシンプル・オシャレにカスタマイズ。H3見出し以下は数字では無く「・」に変更しました。フォントのサイズや色、余白や位置を調整し全体はカラム幅にして見やすくなりました。パステルカラーでスタイリッシュに。 また多少高さもあったので、paddingの数値を減らして、多少高さがなくなりました。, 見出しの大きさとしてh2>h3であることから、その上下関係をはっきりさせるために、h3の見出しをメインコンテンツの幅いっぱいだったものを、文字数によって変動するものに変更しました。 Cocoon 0.5.4公開。目次の表示切替機能を追加、他。 アップデート情報. コピペで出来ますので、お試しください～ 見出しというのは、＜h2＞＜/h2＞や＜h3＞＜/h3＞で囲った、タイトル等を指します。 ①【外観>テーマの編集】 見た目もよくして！ 小さいカスタマイズですが、大きくサイトのイメージが変わったと思います！, テーマによってはカスタマイズなんて必要ないかもしれませんが、HTMLやCSSの知識あるとないとでは、トラブルがあった時に大きく違ってきます。 アデニウムの最近の育ち具合と育ててわかった暫定的な育て方をご紹介. 今回のカスタマイズをするとこのようになります。, 最近見出しのデザインを変更したので一応追加しておきます。 WordPressの無料/有料テーマの使い方, 目次の自動生成を行うかどうかの設定, 目次に「閉じる」「開く」を表示し、利用者が表示の切り替えをできるようにする, どの見出しまで目次に含めるかどうかを設定する, 目次に表示される数字のフォーマットを設定する. h2の見出しを枠線だけの吹き出し風見出しにしてみました！, 当記事では少ししかファイルをカスタマイズしませんが、カスタマイズはカスタマイズなので、必ず子テーマを使用しましょう！ 編集する方法として AdminWeb ©2006-2020 Buzzword Inc.. All Rights Reserved. 今回は無料テーマCocoonのサイドバーに設置するプロフィールボックスを、有料テーマのＪＩＮ風にカスタマイズしていきます！ 2018年7月、ついにCocoonが正式版リリースとなりました。2017年～2018年にかけてかなり多くのWordpressテーマがリリースされたと思いますが、その中でも際立つ超ビッグニュース。かなり多くの人々がCocoonの発表と正式リリ WordPressテーマCocoonの目次をカスタマイズしていきます。 Cocoonは新しいテーマなので特に更新も多く、子テーマを使っていない場合は、施したカスタマイズがすべて無駄になることもあるのでご注意ください。, カスタマイズをするために使用するファイルは「style.css」です。 もともとカスタマイズ記事などでコードを記事に表記する際には、プラグインを使って見やすくし... 【WordPress】無料テーマCocoonで好きなフォントを設定するカスタマイズ！, 【アラジン】グラファイトトースター の2枚焼きと4枚焼きを選ぶポイント【自分はこう選んだ！】, 特に色などはそれぞれのサイトのメインカラーがあると思いますので、変えた方が良いと思います。. グローバルメニューを使っていない人には意味がないですが、使っている人にっては、サイトの印象に大きく影響を与えるのがこのグローバルメニューの見た... 今回はCocoonのカスタマイズ記事です。 『【Cocoon】脱ブログ！固定ページでサイト型トップページにカスタマイズする方法』というわかりやすい題名で情報満載のページです。 テーマをCocoonに変更した後、どんなカスタマイズがあるのかな〜とネット上を探していた発見しました。 2020.08.25 2020.08.27. 線の太さは見出し自体の大きさや、枠線の太さなどの環境によって変わってしまう可能性が高いです。, 一度コードをコピペしてみて、太さが他の部分の異なっている場合は、【.article h2::after】にある【top】を調整してください。 デザインやレイアウトを変更しまくり、都度書いてきたカスタマイズ記事もたまったので目的別にまとめました。, 初心者の方でもできるカスタマイズですので、Cocoonユーザーの方の参考になればうれしいです。, 実際にhtml&cssの知識がなかった僕が、ググり格闘しながら実装してきたカスタマイズです。どんな方にも再現性が高いです。, 各記事からのリンクで、詳細ページに飛ぶ構成です。下の目次を開いて、一覧から目的別に探すのが早いです。, Cocoonのトップページを過去記事やカテゴリー別に並ぶサイト型にしたいなら、この記事です。, Cocoonのトップページのカスタマイズ記事はググれば沢山出てきますが、本記事は初心者ユーザーさんから高い評価をもらってます。（記事内でユーザーさんの声を紹介させてもらってますm(__)m）, 「人気記事」や「アクセスランク」がトップページとカブったことから、必要性にかられて着手。, WordPress標準のリストって、なんか寂しいんですよね。Cocoonなら「アイコンリスト」で「・」は、下記のような表示に変更できます。, ただ数字リストがデフォルトしかないので作りました。数字リストはブログでは重宝しますから。, ただ当ブログ、ページスピードを測ってみると悲惨な数値が…。なんとかCocoonのポテンシャルを取り戻すため、高速化を目指した記事。, Cocoonの「おすすめカード」を使えば、見てもらいたい記事やカテゴリーを読者にプッシュすることができます。, ブログにTwitterタイムラインがあれば、SNSとの導線が太くなります。「ブログ×SNS」の相乗効果を高めましょう。, Googleアドセンスの「リンク記事は廃止」との記事を見て諦めていたんですが、”だめもと”でやってみると実装できちゃいました。, デフォルトでCocoonはカラーパレットが豊富なんですが、さらに欲しい色を追加することができます。これで実質、使えない色はないです。, アフィリエイトボタンが押されないのを、完全にCocoonのせいにして着手したカスタマイズですm(__)m, >>>Cocoonボックスメニューを”イケメン”カスタマイズ→「帰さないゼ」仕様にした, 各記事で、説明通りやっても求める仕様にならなかった場合→下部の問い合わせか、TwitterのDMより、いつでもご相談ください。一緒に解決させてもらいます！, Cocoonはユーザー側に育てることを求めるテーマでもあります。（Cocoon製作者のわいひらさんも言及してます）どうしてもカスタマイズに、多少のプログラミング知識が必要になってきます。, 有料テーマだとこれまでにご紹介したカスタマイズが、ボタン一つみたいなことがあります。, カスタマイズが簡単なおすすめ有料テーマは下記で詳しく。>>>WordPressおすすめテーマ6選打ち消し線の理由↓↓↓, 最近、別サイトで運営するブログでSWELLを使い始めたんですが、正直、最高です。使用感は、どのWordPressテーマをも凌駕します。>>>SWELL公式ページはこちら, ※CocoonとSWELLの比較記事へのリンクは、当記事の最後から2番目にあります。, Cocoonをイジくりまくって運営してきた僕が、利用1年の期にガチレビューしました。, 無料から万人に受けると思われるCocoonですが、その実、中級者〜向きだったりします。, >>>CocoonになくてSWELLにあるもの5つ、SWELLになくてCocoonにあるもの3つ, SWELLのような素晴らしいテーマと、無料テーマながら渡り合うCocoonってスゴイな、と改めて感服しました。, 本記事を見て、Cocoonをカスタマイズした方がいれば是非、Twitter（@blue_chikippaa）でメンション付けるかDMで教えてください！, 【元産経新聞社サンスポ記者】 ★20年3月、15年間勤めたサンスポを退職→雇われない生き方を実践中。, 【2020年11月5日までお得キャンペーン中！】 ◎ドメイン永久無料 ◎20％off、月額料金720円〜 ◎新サービス「WordPressクイックスタート」なら、速攻ブログ開設！ ・レンタルサーバーの契約 ・ドメイン名の取得・設定 ・SSLの設定 ・WordPressの設置 まとめてエックスサーバーが自動でやってくれるから、従来の煩雑な設定が不要。, 【設定方法を全画像付き解説！】 https://to-chi.org/wordpress-quickstart/, 高機能なCocoonの使い方として、プラグインはそう多く必要ありません。本記事では、Cocoon使いの筆者が厳選したプラグインを10個ご紹介。本当に最低限、鉄板、ド定番といったプラグインですので、「入れておかないと〇〇になるぞ〜」と多少煽った構成になってます。あしからず。, 「Cocoonのスキンに合ったカラーがブロックでも使えるようにならないかな。デフォルトのものじゃ、どうも自分のブログに合わないんだよな〜」←こういった疑問に答えます。Cocoonはアップデートによって、カラーパレットに自分の好きな色を6種類追加できる仕様になりました。ごにょごにょとコードをイジらなくても標準でできます。, Cocoonを使っていて、SWELLが気になっている人、多いのではないでしょうか？僕もその一人だったんで、SWELLを使ってサイト運営してみました。本記事では、実際に2テーマを並行して利用する筆者が、両テーマを「ある＆なし」の視点で比較。WordPressテーマ選びの参考に、ぜひ参考にしてください。, 「よく見る『スポンサー検索』ってついた広告を自分のブログにもつけたい。でも、なくなったって聞くし、もう無理なのかな」←こういった疑問に答えます。CocoonならGoogleアドセンスの「リンク広告」の設定も簡単です。収益効果も期待できるため、リンク広告をあきらめていたCocoonユーザーは、ぜひ参考にしてみてください！, 「WordPressのテーマ、Cocoonってどうなの？実際に使っている人の意見を聞きたい」←この悩みを解決する記事です。僕が、この1年Cocoonを使用して感じたメリット5つ・デメリット2つをご紹介。Cocoonに向くタイプ、向かないタイプも解説してます。是非、テーマ選びの参考にしてください。, 「Cocoonを使ってるけど、アフィリエイトタグ・リンクの貼り方がわからない」「貼っているけど、あってるかわからない」←こういったCocoonユーザーの悩みを解決します。アフィリエイトタグの貼り方は、ブログ初心者のつまづきポイント。本記事では3つのCocoonアフィリエイトタグ・リンクを貼り方を、全手順画像付きで解説します。, CocoonになくてSWELLにあるもの5つ、SWELLになくてCocoonにあるもの3つ.