フッターのアフィリエイトリンクボタン機能標準搭載の「NAGI」スキンを同梱

パステルカラー調のカラフルなスキン「カラフルライン」追加

Cocoonに「サムライブルー（無印）」スキンを同梱追加

和色ベースのシンプルな「Fuwari和色」スキン4種を同梱追加

Cocoonスキン「ゆっくり色が変化」を同梱追加

きのこをモチーフにしたオリジナルスキン「ハナオチバタケ」の紹介

Cocoonに「サムライブルー」スキンを同梱追加。サッカー日本代表ユニホーム(勝色モデル)がモチーフ。

モノトーン調にデザインされた「モノクロ」スキンを同梱追加

大人かわいいCocoonスキン「イノセンス」を追加

パステルカラーのかわいい系Cocoonスキン「アリス」等を追加

作り込み機能が満載な「メイド・イン・ヘブン」スキンを同梱

1カラムのシンプルスキン「Metal Styles」を同梱追加

豊富なカラーバリエーションのシンプルなスキン「Veilnui Simplog」を10種類追加＋α

Cocoonスキン「ほんわかライトニング」を同梱追加

美しいグレーに統一されたデザインの「grayish」スキンを同梱

立体感をコンセプトにしたニューモフィズムデザインの「凸凹」スキンを同梱追加

投稿・固定ページ

投稿・固定ページの管理画面で行う設定です。

わいひら

個々のページ毎に違う設定を行うための設定です。

Cocoonのテーブルをレスポンシブ対応にする

Cocoonの本文内のテーブルをレスポンシブ対応するには管理画面から「Cocoon設定」→「本文」タブを選択して下さい。「テーブル」の「レスポンシブテーブル」にある「横幅の広いテーブルは横スクロール」にチェックを入れてください。これで画面幅...

2021.07.04 2022.07.04

わいひら 0

投稿・固定ページ

投稿のメインカテゴリーを選択する方法。意図したカテゴリーをラベルに表示する設定。

カテゴリーの複数選択をしたとき、意図通りのカテゴリーをアイキャッチラベルやパンくずリストに表示する方法です。

2020.06.24

わいひら 3

投稿・固定ページ

フィード（RSS等）に特定の投稿を表示させない方法

RSSフィードなどに特定の投稿を表示させたくない場合の設定方法です。

2020.06.17

わいひら 0

投稿・固定ページ

特定のカテゴリー属する投稿をアーカイブ（インデックスリスト等）に表示しない方法

アーカイブの一覧から特定のカテゴリを除外する方法。

2020.06.17 2023.11.10

わいひら 0

投稿・固定ページ

アーカイブ（インデックス一覧等）に特定の投稿を表示させない方法

投稿一覧リストに特定の投稿を表示させたくない場合の設定。

2020.06.17

わいひら 4

投稿・固定ページ

コメント欄のURLをブログカード化する方法

コメント入力されたURLブログカードで表示する設定方法です。

2020.02.25

わいひら 0

投稿・固定ページ

SNSシェア・フォローボタンの表示をページタイプごとに切り替える方法

SNSボタンを表示できるページタイプを設定できます。

2019.12.20

わいひら 0

テーマ設定投稿・固定ページ

Gutenbergカラーパレットに好みの色を追加する方法

Gutenbergのカラーパレットに好みの色を追加する方法。

2019.11.14

わいひら 0

投稿・固定ページ

レスポンシブテーブルを利用している際に1列目を固定表示する方法

テーブルをレスポンシブ表示にしている際に、テーブルの最初の列を固定表示する設定方法です。

2019.11.14

わいひら 0

投稿・固定ページ

Cocoonの画像拡大効果（Lightbox）ライブラリ各々お勧めの使いどころ

写真を暗転し拡大して表示するLightbox効果のあるJavaScriptライブラリの使いどころを紹介しています。

2019.09.28 2023.09.14

わいひら 0

投稿・固定ページ

Cocoonのコードハイライト機能で多言語に対応する方法（highlight.js）

highlight.jsがハイライト表示できる全ての言語に対応させる方法です。

2019.09.05 2024.11.30

わいひら 0

投稿・固定ページ

Google検索結果に星評価を表示する方法（レビュー構造化データの出力）

レビュー用のJSON-LD構造化データを出力して、Google検索結果などに星評価を表示させることができます。

2019.09.05

わいひら 4

投稿・固定ページ

投稿・固定ページのcanonicalタグを変更してURLを正規化する方法

canonical属性を変更して、コンテンツのキーワードカニバリゼーションを防ぐための設定です。

2019.07.25

わいひら 0

投稿・固定ページ

「記事を読む目安時間」の表示をページ毎に切り替える方法

トップページやサイトマップページで「読み時間の目安」表示を非表示にしたい場合などにどうぞ。

2019.05.15

わいひら 0

投稿・固定ページ

ブロックエディターのショートコードドロップダウン表示を切り替える方法

ショートコードのドロップダウンツールボタンの表示を切り替える方法です。

2019.05.15 2019.06.08

わいひら 0

投稿・固定ページ

ブロックエディターのスタイルドロップダウン表示を切り替える方法

ブロックエディターのインラインスタイルドロップダウンのツールバーの表示切り替え方法です。

2019.05.15

わいひら 0

投稿・固定ページ

「記事を読む目安時間」を表示する方法

記事を読む際に「この記事はどれくらいの時間かかるのか？」ということを訪問者にわかりやすく伝えます。

2019.04.26

わいひら 5

投稿・固定ページ

文章に挿入した拡張インラインスタイルを解除する方法【ブロックエディター】

Cocoonで文章に装飾したインラインスタイルタグを削除する方法。

2019.03.24

わいひら 0

投稿・固定ページ

本文の「行の高さ」と「行間の余白」を変更する方法

本文中の余白を変更して読みやすさを調整できます。

2019.01.29 2019.01.30

わいひら 0

投稿・固定ページ

投稿に対してSNS拡散向けの画像を設定する方法

投稿・固定ページに対して、アイキャッチとは別にSNS向けの画像を設定する方法です。

2018.10.22

わいひら 0

投稿・固定ページ

1 2

タイトルとURLをコピーしました

'); /* ヘッダーの高さの変化分、paddingで調整しスクロール位置を止まらせる */ $("#header-fixed").css({ 'padding-top': `${threashold}px`, }); /* トップメニュータイプに変更する */ $("#header-container-in").removeClass('hlt-center-logo hlt-center-logo-top-menu').addClass("hlt-top-menu wrap"); $("#header-container").addClass("fixed-header"); $("#header-container").css({ 'position': 'fixed', 'top': '-100px', 'left': '0', 'width': '100%', }); const wpadminbar = document.getElementById('wpadminbar'); const headerContainerTop = wpadminbar ? wpadminbar.clientHeight : 0; $('#header-container').animate( { top: headerContainerTop, }, 500 ); } } /*固定ヘッダーの解除*/ function staticHeader() { if ($("#header-container").hasClass("fixed-header")) { /*センターロゴタイプに戻す*/ $("#header-container-in").removeClass("hlt-top-menu hlt-tm-right hlt-tm-small hlt-tm-small wrap").addClass(" hlt-center-logo"); $("#header-container").removeClass("fixed-header"); $("#header-container").css({ 'position': 'static', 'top': 'auto', 'left': 'auto', 'width': 'auto', }); /* ヘッダーの高さの戻る分、padding削除しスクロール位置を止まらせる */ $("#header-fixed").css({ 'padding-top': '0', }); $("#header-fixed").remove(); } } /* 境界値をヘッダーコンテナに設定 */ var threashold = $('#header-container').height(); var prevScrollTop = -1; var $window = $(window); var mobileWidth = 1023; $window.scroll(function() { var scrollTop = $window.scrollTop(); var s1 = (prevScrollTop > threashold); var s2 = (scrollTop > threashold); var w = $window.width(); /*スクロールエリアの位置調整*/ function adjustScrollArea(selector) { if ($(selector) && $(selector).offset()) { offset = $(selector).offset().top; h = $("#header-container").height(); pt = $(selector).css('padding-top'); if (pt) { pt = pt.replace('px', ''); } else { pt = 0; } if ((scrollTop >= offset - h) && (w > mobileWidth)) { if ((pt <= 1) && $("#header-container").hasClass('fixed-header')) { $(selector).css({ 'padding-top': h + 'px', }); } } else { if (pt > 0) { $(selector).css({ 'padding-top': 0, }); } } } } /*スクロール追従エリアの調整*/ function adjustScrollAreas() { adjustScrollArea('#sidebar-scroll'); adjustScrollArea('#main-scroll'); } /*固定ヘッダーのスタイル決め*/ function adjustFixedHeaderStyle(s1, s2, w, scrollTop, mobileWidth) { if (s1 ^ s2) { if (s2 && (w > mobileWidth)) { stickyHeader(); } } /* 境界値に達したら固定化 */ if (scrollTop <= threashold || w <= mobileWidth) { staticHeader(); } } adjustFixedHeaderStyle(s1, s2, w, scrollTop, mobileWidth); adjustScrollAreas(); prevScrollTop = scrollTop; }); /*ウインドウがリサイズされたら発動*/ $window.resize(function () { /*ウインドウの幅を変数に格納*/ var w = $window.width(); if (w <= mobileWidth) { /*モバイル端末の場合*/ staticHeader(); } else { /*パソコン端末の場合*/ var scrollTop = $window.scrollTop(); if (scrollTop >= 50) { stickyHeader(); } } }); })(jQuery);