ショートコードが初期状態でついてるとか嬉しいですよね。素晴らしいよCocoon。Cocoonのショートコードの機能の使い方や設定できる項目についてまとめておきます。Cocoonとは?SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100%GPLテーマです。個人的には無料テーマでは最強ではないかと思っています。使い方と言ってもビジュアルエディタで好きなショートコードを選択するだけ、です。好きなように表示するためにはオプションを設定する必要があります。使うもの(というかAPIキーが不必要なもの)だけですが、それぞれのショートコードで使用できるオプションなどを書いておきます。ショートコード:新着記事一覧こういうやつですね。【初心者CSS】Cocoonで「斜めの背景」を使う方法2020.02.07Flexboxでよく使うレイアウト※レスポンシブサンプルつき2020.02.062020年2月の無料WordPressテーマをチェック!2020.02.03基本ソースはコレ。post_type="post"]新着記事一覧のオプション基本ソースでいえば、「count=”5′′」がオプションです。「count」は表示記事を表し、「5」がその数。「記事を5つ表示せよ」というオプションが付いているのですね。デフォルトだと「新着記事一覧、5記事、表示はサムネイルとタイトル、子カテゴリを除く全てのカテゴリを表示、投稿記事だけ」という指定がされています。パラメータは半角スペースで区切って複数書くことができます。その他にも使えるものがあるのでまとめます。「count=”10′′」など。独自のクラスをつけるか。class=”sample”と書くと「sample」というクラスが付与される。スペース区切りで複数記述可。カンマ区切りで複数指定可。「all」で全カテゴリ。カンマ区切りで複数指定可。post_type=”post,page”など。postが投稿、pageが固定ページ。taxonomy=”post_tag”など。デフォルトは”category”。「type=”large_thumb_on”」のこの表示かっこいいですよね。【初心者CSS】Cocoonで「斜めの背景」を使う方法2020.02.07Flexboxでよく使うレイアウト※レスポンシブサンプルつき2020.02.06ショートコード:人気記事一覧こういうやつですね。Cocoonをコーポレートサイトっぽくカスタマイズ!1トップページ編2019.10.152020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!6おまけ:新着情報編2019.11.262020.01.142020年のWEBトレンドについての予習と思うこと2019.11.212019.12.24基本ソースはコレ。cats="all"]使えるオプションは「days」「rank」「pv」「count」「cats」「type」で、基本的な使い方は新着記事一覧と同じです。人気記事一覧のみで使えるオプションをまとめておきます。「all」だと全期間。pv=”1′′...PV数を表示するpv=”0′′...PV数を表示しない(デフォルト)ショートコード:ナビカードWordPressの「メニュー」で作成したメニューを表示します。先にメニューを作る必要があります。手順に関しては公式のマニュアルが解りやすいと思います。意図した記事一覧を作成できる「ナビカード」ショートコードの使い方サイト訪問者を的確に誘導するために、意図したリンクリストを作成するショートコードの使い方です。wp-cocoon.com好きなページをリストにして表示する事ができるんですね。ページ」「カテゴリー」「タグ」ページです。arrow="0"]使えるオプションは「type」「bold」「arrow」「class」で、基本的な使い方は新着記事一覧と同じです。(オプション)」で設定できるのは以下の数字。こちらの設定をするとサムネイルにリボンがかかったスタイルが適用されます。上のサンプルで1から順に設定してみましたので参考に。ショートコード:プロフィールボックスプロフィールボックスを表示します。この記事を書いた人nullll未経験から突然小さな会社のインハウスWebデザイナーになりましたので、WEBサイト制作に役立つ情報のメモを残そうと思います。同じような方の参考になれば幸いです。nullllをフォローする基本ソースはコレ。label=”この記事を書いた人”のように使用。ショートコード:タイムライン・タイムラインアイテムたとえばこんな年表とか、申し込み手順などに使うやつです。「タイムライン」「タイムラインアイテム」を組み合わせて使用します。「タイムライン」基本ソースはコレ。title=""][/timeline]「タイムラインアイテム」基本ソースはコレ。title="タイムラインのタイトル"]タイムラインの内容[/ti][/timeline]このように書きます。入力した日付から経過年を出してくれるショートコード。「デビューからXX年」、などのときいちいち書き変えなくて済む...!デビューから20年!!基本ソースはコレ。from=""]fromオプションはYYYY-MM-DDやYYYY/MM/DDやYYYYMMDDで記述。from=”2001-01-01′′、from=”2001/01/01′′、from=”20000101′′、のようになります。過去日時とほぼ同じ、ですが単位を変えられるようになっています。今年で20年!!基本ソースはコレ。unit=”歳”のように使用。過去年とほぼ同じ、ですがオプションが「from」でも「birth」でもOKになってる。今年で20歳!!基本ソースはコレ。from=""]オプションは「unit」も使えます。ショートコード:カウントダウン未来の日付までカウントダウンします。ドラえもんの誕生日まで33798年!!基本ソースはコレ。to=""]toオプションはYYYY-MM-DDやYYYY/MM/DDやYYYYMMDDで記述。to=”2100-01-01′′、from=”2100/01/01′′、from=”21000101′′、のようになります。指定日を過ぎると「0」表示になります。オプションは「unit」も使えます。ショートコード:評価スターレーティングスターとも呼ばれる、★の数で度合いを表すアレです。5.03.5基本ソースはコレ。0.1刻みで数値を入力。数値表示をするかどうか。まとめ思ったよりボリュームが大きくなってしまった...ページ分ければよかった...そして後半息切れして雑になってしまった。Cocoon、他にもアフィリエイトなどで便利に使えるショートコードがあります。何度も言いますけど本当にすごいなあ。コピーnullllをフォローするnullllnullllog関連記事WORDPRESSWordPressバージョンの「コードネーム」の元ネタを調べてみましたWordPressのバージョンに「コードネーム(愛称)」があることをご存知でしたでしょうか。コードネームのほとんどはジャズミュージシャンから取られています。気になったので名前が付けられているものを調べてみました。今回はXFREEで複数のWordPressをインストールする方法をわかりやすく説明します。この方法で5つのWordPressがインストールできます。超初心者がSVGをWordPressで扱う方法をまとめておきます。デフォルトではWordPressでSVGファイルをアップロードできないため注意が必要です。WORDPRESSWordPressテーマ、どうやって選ぶ?Wordpressテーマを「どのように選んだか」「どのように選べばいいのか」のお話です。WORDPRESSCocoonをコーポレートサイトっぽくカスタマイズ!3料金表編Cocoonが便利すぎて、なんとかコーポレートサイトとかビジネスサイト、企業サイトっぽくカスタマイズ出来ないかと思いいろいろ試してみることにしました。カラム分けとテーブルのレスポンシブ化について書いています。WORDPRESSWordPress無料テーマCocoonのスタイル一覧WordPress無料テーマCocoonのスタイル一覧です。Cocoonビジュアルエディタで選択できるスタイルを見やすく一覧にしました。HTMLサンプルソースや使用例付き。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。素材アーカイブ2020年2月2020年1月2019年12月2019年11月2019年10月2019年9月2019年8月おすすめサーバこのサイトでも使用しています。まとめAUTHOR書いた人nullll未経験から突然小さな会社のインハウスWebデザイナーになりましたので、WEBサイト制作に役立つ情報のメモを残そうと思います。同じような方の参考になれば幸いです。nullll14人気記事Cocoonをコーポレートサイトっぽくカスタマイズ!1トップページ編2019.10.152020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!6おまけ:新着情報編2019.11.262020.01.14Cocoonをコーポレートサイトっぽくカスタマイズ!7おまけ:ヘッダに電話番号編2019.12.122020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!2メニュー編2019.10.162020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!3料金表編2019.10.182020.01.09nullll未経験から突然小さな会社のインハウスWebデザイナーになりましたので、WEBサイト制作に役立つ情報のメモを残そうと思います。同じような方の参考になれば幸いです。Reserved.検索メニューWEBWORDPRESSWORKSいろいろプロフィールタイトルとURLをコピーしました。