アイテムに関する記事一覧 | WordPressテーマ「ICONIC (tcd062)」

記事詳細ページのフォントタイプやカラー、サイドバーの表示をテーマオプションから詳細に設定可能

Owner — Thu, 01 Jan 1970 00:00:00 +0000

当テーマでは、記事詳細ページのフォントやサイドバー表示の設定まで詳細に設定することができます。

「フォントを変更したい」というのは、サイトテンプレートにおいてはよくある要望の一つです。フォントによってサイトのイメージが大きく変わるからです。当テーマでは、多種多様なサイトのイメージにマッチするよう、フォントタイプを選択することが可能です。
基本フォントとは別に、大見出しで別のフォントを選択することも出来ます。

Ver1.20のテーマアップデートでフォント機能が新しくなりました。
選択できるフォントなど詳しくは以下の記事をご覧ください。
>> WordPressテーマTCDで搭載された美しいフォント

実用性を重視した「フッターバー」が記事の拡散効果を増大

Owner — Thu, 01 Jan 1970 00:00:00 +0000

パソコンよりもスマホでの閲覧の方が多くなりがちな昨今、スマートフォンにも一発でユーザーが電話予約やシェアが行える簡便なUX/UI設計が重要となってきています。

最近のTCDテーマでは、電話予約や記事のシェアにすぐにつなげれるようスマホ画面の最下部に常にフッターバー固定表示させることができます。これはサイト閲覧者にお店やサイトの情報を分かりやすく伝えるほか、アイコンの種類は6種類あり用途に応じて使い分けてさまざまな使い分けが可能となっています。

デザインはこのような感じです。一度実機で見るのがいいかもしれません。4つ推奨ですがいくつでも表示できます。

「シェア」をタップするとポップアップでツイッター、フェイスブック、LINE、はてぶの4つのシェアボタンが表示されます。

アイコンは全部で6種類用意されており、いくつもアイコンを表示（4つ推奨）させることができます。

国内トップクラスのデザイン・機能・実用性を備えたWordPressテーマTCD一覧

Owner — Thu, 01 Jan 1970 00:00:00 +0000

WordPressテーマTCDシリーズのテンプレートをご紹介します。TCDシリーズのテンプレートはいずれにおいても、国内最高峰の機能性とデザイン性、実用性を有しております。ハイクラスなサイトを運営するのに最適なテーマです。

それぞれテーマによって、大きくレイアウトが異なります。用途に合わせてお選びください。

TCDテーマオリジナルウィジェットでサイトの見た目を向上させる

Owner — Thu, 01 Jan 1970 00:00:00 +0000

WordPressにはデフォルトで多くのウィジェットが最初から存在していますが、TCDテーマではオリジナルのウィジェットを用意しています。例えば、下記のようなアイキャッチ画像付きの記事一覧です。通常は記事タイトルのみが表示されるものがアイキャッチ画像つきで表示されるわけです。

さらに、「おすすめ記事」として設定した記事のみを表示したり、日付順に表示したり、ランダム表示できたり、表示数を制限したりと、様々な設定がウィジェット内で可能です。

「サイト情報」ウィジェットを使うと下図のように、特に難しい設定も必要とせず、スタイリッシュにストア情報を表示することができます。

他にも、広告がローテーション表示ができる「広告ウィジェット」や「Googleカスタム検索ウィジェット」など、デザイン性と機能性を兼ね備えたオリジナルウィジェットをご用意しています。

デザイン知識不要！いつもの記事をワンランクアップするクイックタグ機能の使い方

Owner — Thu, 01 Jan 1970 00:00:00 +0000

HTMLやCSSの知識不要で、記事作成時のスタイル指定を簡単に行えるクイックタグ機能をご用意しました。
たとえば、使用頻度の高い見出し、リンクボタン、囲み枠といったスタイルをボタン1つで呼び出すことができます。

「

」といった煩わしい記述を行う必要がなくなることで記事作成の効率化につながるほか、単調になりがちな記事ページに視覚的なリズムをプラスする効果も見込めます。

また、記事の装飾のほかにもYoutube動画のレスポンシブ表示、サイト内の関連記事をスマートに美しく表示できるカードリンクパーツといった記事ページのユーザビリティを補強するスタイルもご用意しています。
→クイックタグ一覧

読みやすく伝わりやすい記事作成にぜひお役立て下さい。

記事の装飾をより美しくするためのTCD独自機能「クイックタグ」一覧

Owner — Thu, 01 Jan 1970 00:00:00 +0000

テーマ付属の設定ファイルに入っているクイックタグの表示サンプル一覧です。
エディタ上に表示されるクイックタグボタンと同じ順にご紹介します。

Youtube動画のレスポンシブ表示

記事内のYoutube動画をレスポンシブ表示します。
ブラウザのウィンドウ幅を縮小してスマホでの表示スタイルをご確認ください。
PCでは、メインカラム幅より横幅が大きい動画でも自動的にカラム幅ぴったりにリサイズされます。

カラムレイアウト

レイアウト2c

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

レイアウト3c

見出しスタイル

H3見出しa

H3見出しb

H4見出しa

H4見出しb

H5見出しa

H5見出しb

囲み枠のスタイル

スタイル1･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

スタイル2･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

スタイル3･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

カスタマイズ＊囲み枠のカラーバリエーション

※クラス指定を追加することで配色の変更が可能です。

スタイル1（red）･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

スタイル1（blue）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

スタイル1（green）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

スタイル1（yellow）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

ボタンのスタイル

フラットボタン（デフォルトサイズ）
フラットボタン-L
フラットボタン-S

フラットボタン（red）
フラットボタン（blue）
フラットボタン（green）
フラットボタン（yellow）

角丸ボタン（デフォルトサイズ）
角丸ボタン-L
角丸ボタン-S

ラウンドボタン（デフォルトサイズ）
ラウンドボタン-L
ラウンドボタン-S

カスタマイズ＊ボタンの配置方法を指定する

※pタグで囲い、クラス指定を追加することで配置方法の指定が可能です。

フラットボタン-L（左揃え）

フラットボタン-L（中央揃え）

フラットボタン-L（右揃え）

テーブルのレスポンシブ表示

テーブルタグで作成された表組みをレスポンシブに表示するためのタグです。
ブラウザのウィンドウ幅を縮小してスマホでの表示スタイルをご確認ください。

CSS	Cascading Style Sheets（CSS、カスケーディング・スタイル・シート、カスケード・スタイル・シート）とは…
レスポンシブデザイン	レスポンシブデザイン（RWD）とは、Webデザインの手法の一つで、様々な種類の機器や画面サイズに単一のファイルで対応すること。表示された機器の種類やサイズに応じて表示内容が最適な状態に変化するよう設定された単一のファイルを制作し、すべての機器に同じように送信する…

フォームのスタイル

プラグイン「Contactform7」で作成したフォームを記事内に設置した際のスタイル設定も含まれています。
レスポンシブ表示に対応しています。
[contact-form-7]

投稿者名や関連記事など、幅広くテーマオプションから表示・非表示ができる

Owner — Thu, 01 Jan 1970 00:00:00 +0000

投稿者名やコメント、トラックバック、SNSボタンや関連記事など、非表示にしたい項目があれば、テーマオプションからチェックを外すだけで完了することができる便利機能を搭載しています。

幅広いサイト運営を行うのにこのカスタマイズ機能は必須とご好評いただいている機能です。

ページ遷移時のストレスを極力軽減するロードアイコン

Owner — Thu, 01 Jan 1970 00:00:00 +0000

多くの類似サイトが乱立する昨今、ページ遷移時にもユーザーに対する気配り含め、アニメーションを表示することで、サイトへの印象をガラっと変えることができます。

同時に、ユーザーに要素がくずれた状態でサイトをお見せしてしまう心配もなくなります。

当テーマではテーマオプションで簡単にオン・オフの切り替えが可能なのに加え、「サークル」、「スクエア」、「ドット」の３種類のロードアイコンと最大表示時間を3～10秒から選択できるようにしました。

ページ表示速度はサイトユーザーの離脱率に直接影響する要素ともいえるので最善を尽くしたいですね。下記ページでは表示速度を改善するためのTipsをご紹介していますのでこちらも併せてご参考ください。
→WordPressサイトの表示速度が遅いときに試したい10Tips

CSSの独自デザイン編集も楽々「カスタムCSS」

Owner — Thu, 01 Jan 1970 00:00:00 +0000

テーマのアップデートによって、せっかく上書きしたCSSがもとに戻ってしまうことがあります。
しかし当テーマで搭載しているカスタムCSSに記述しておけば、自動的に記憶してくれますので、テーマのアップデートを行っても追記が損なわれることはありません。

これによりCSSの編集に関しては子テーマの導入が必要なくなります。

サイトのメインカラー・サブカラーを自由に設定可能

Owner — Thu, 01 Jan 1970 00:00:00 +0000

サイトのメインカラー、サブカラーや記事のテキストカラー、リンクテキストカラーをテーマオプションから自由に変更できます。

設定方法は管理画面の左メニュー【テーマオプション】→【基本設定】から変更したい色を選ぶだけです。

色はマウスを動かしながら直感的に決められるので、タグの専門的な知識は不要です。

なお、部分的な配色のカスタマイズに関しては、サポートにお問い合わせくださいますか、TCDラボで探していただけますとスムーズに行っていただけます。

アイテムに関する記事一覧 | WordPressテーマ「ICONIC (tcd062)」

記事詳細ページのフォントタイプやカラー、サイドバーの表示をテーマオプションから詳細に設定可能

実用性を重視した「フッターバー」が記事の拡散効果を増大

国内トップクラスのデザイン・機能・実用性を備えたWordPressテーマTCD一覧

TCDテーマオリジナルウィジェットでサイトの見た目を向上させる

デザイン知識不要！いつもの記事をワンランクアップするクイックタグ機能の使い方

記事の装飾をより美しくするためのTCD独自機能「クイックタグ」一覧

Youtube動画のレスポンシブ表示

関連記事のカードリンク表示

カラムレイアウト

レイアウト2c

レイアウト3c

見出しスタイル

H3見出しa

H3見出しb

H4見出しa

H4見出しb

H5見出しa

H5見出しb

囲み枠のスタイル

カスタマイズ＊囲み枠のカラーバリエーション

ボタンのスタイル

カスタマイズ＊ボタンの配置方法を指定する

テーブルのレスポンシブ表示

フォームのスタイル

投稿者名や関連記事など、幅広くテーマオプションから表示・非表示ができる

ページ遷移時のストレスを極力軽減するロードアイコン

CSSの独自デザイン編集も楽々「カスタムCSS」

サイトのメインカラー・サブカラーを自由に設定可能