TAテーマ001全般にわたる基本操作

TAテーマ001全般にわたる基本操作

TAテーマ001全般にわたる基本操作の説明です。

 

TAテーマ001の既成メニュー設定(関連付け)
① メニュー設定画面へ行きます

readymade_menu1
サイト上部の管理ツールバーから”メニュー”を選んでメニュー設定画面に行きます。

 

② 任意のメニューを作成します

readymade_menu2
既存のメニューが無ければ新規にメニューを作成します。ここでは”グローバルメニュー”を作成します。(メニュー名は任意でOKです)

メニュー名の欄に任意の名前を入力して”メニューを作成”をクリックします。

 

③ メニュー項目を設定します

左側の欄から項目を選択して右側のメニューに追加します。

 

④ 既成メニューの設定(関連付け)

TAテーマ001には7種類の既成メニューが用意されています。

※ 『TAサイドバーメニュー』の#2~#10はHightEndの機能です。
※ 『TA汎用メニュー』はHightEndの機能です。
※ 『TA画像説明付メニュー』はHightEndの機能です。

使用するTAテーマ001の既成メニューに対応する任意のメニュー名を関連付けてください。

メニュー構造を編集して関連付けしたいTAテーマ001の既成メニューにチェックを入れたのちに”メニューを保存”をクリックします。

 

⑤ 関連付けの確認

関連付けが正しく行われると左図の様に表示されます。

TAテーマ001の配色設定ツール(カラーピッカー)操作方法
WordPress標準カラーピッカー操作方法

WordPress標準カラーピッカーの操作方法の説明です。

① ”色を選択”をクリックすると選択画面が表示されます。

② 現在選択されている色が表示されます。

③ ”現在の色”をクリックすると展開されている表示が消えます。

④ 現在選択されている色のコードが表示されます。色コードが分かっている場合はここに直接入力できます。

⑤ ”クリア”をクリックすると現在の情報が削除されます。

⑥ ○マークを移動して色を選択できます。

⑦ バーを移動させることで選択した色の濃淡を調整できます。

⑧ ”透明”をクリックすると透明色が選択されます。透明マークが無くても色コード欄に”transparent”と入力すると透明色になります。

※ WordPress標準カラーピッカーで色情報を変更させてもカラーピッカーの表示が変化するだけです。各設定ページの更新ボタンをクリックした場合に設定値として登録されますのでご注意ください。

TAテーマ001拡張カラーピッカー操作方法

TAテーマ001拡張カラーピッカーの操作方法の説明です。

① ”単色変更”をクリックすると選択画面が表示されます。選択画面が表示された状態で”単色変更”をクリックすると展開されている表示が消えます。

② 現在選択されている色が表示されます。色表示枠の上部に対応する色コードも表示されます。

③ サイトイメージカラーから色を選択(ラジオボタンにチェック)できます。※ サイトイメージカラーは、TAテーマ001・共通設定メニュー ⇒ 『カラー・フォント』 ⇒ 『サイトイメージカラー 』にて設定できます。

④ リンク付共通フォントの設定色から色を選択(ラジオボタンにチェック)できます。※ リンク付共通フォントの設定色は、TAテーマ001・共通設定メニュー ⇒ 『カラー・フォント』 ⇒ 『共通フォント』にて設定できます。

⑤ 任意選択:ラジオボタンにチェックを入れると任意の色指定が可能です。色選択の方法は『WordPress標準カラーピッカー操作方法』をご覧ください。

※ TAテーマ001拡張カラーピッカーで色情報を変更させてもカラーピッカーの表示が変化するだけです。各設定ページの更新ボタンをクリックした場合に設定値として登録されますのでご注意ください。

TAテーマ001拡張カラーピッカーのグラデション操作方法

TAテーマ001拡張カラーピッカーのグラデション操作方法の説明です。

① グラデーション:チェックを入れるとグラデーション表示が有効になります。

② ”詳細設定”をクリックするとグラデーション設定画面が表示されます。設定画面が表示された状態で”詳細設定”をクリックすると展開されている表示が消えます。※ 設定画面の左上部の”×close”をクリックしても展開されている表示が消えます。

③ 現在選択されている色が表示されます。色表示枠の上部に対応する色コード(単色の場合)も表示されます。

④ 単色の設定時に使用します。色選択の方法は『TAテーマ001拡張カラーピッカー操作方法』をご覧ください。

⑤ 現在選択されているグラデーション配色が表示されます。

⑥ グラデーション中間色の有無:”使用する”にチェックを入れるとグラデーションの中間色が有効になります。中間色の位置は⑦で指定します。※ IE9以下では中間色は表示されません。

⑧ グラデーションの方向

⑨~⑪ グラデーションの配色設定 色選択の方法は『TAテーマ001拡張カラーピッカー操作方法』をご覧ください。

※ TAテーマ001拡張カラーピッカーのグラデション操作で色情報を変更させてもカラーピッカーの表示が変化するだけです。各設定ページの更新ボタンをクリックした場合に設定値として登録されますのでご注意ください。

※ IE9は最新のグラデーション機能に未対応のためTAテーマ001グラデーションの中間色は表示されません。

TAテーマ001の画像アップロードツール(画像アップローダー)操作方法
(テーマ内蔵:Built_in)画像の設定

TAテーマ001には内蔵画像を選択できる箇所があります。(画像アップローダーに『内蔵画像』が表示されます)

テーマに内蔵された画像の設定をする場合には画像アップローダーの『内蔵画像』をクリックします。左図の例では登録画像がありませんが既に登録画像が存在しても同様です。



『内蔵画像』をクリックすると左図の様に対応する画像が表示され登録欄に”built_in”と表示されますので設定更新ボタンをクリックします。※ ”更新すると下の内蔵画像URL情報が登録されます。”と表示がある場合はまだ設定が登録されていません。


左図の様にテーマ内蔵画像が登録されました。※ ”更新すると下の内蔵画像URL情報が登録されます。”の表示が消えます。

 

画像のアップロード

画像のアップロードをする場合には画像アップローダーの『画像を変更』をクリックします。左図の例では登録画像がありませんが既に登録画像が存在しても同様です。


ul2
左図の様な画面が表示されます。

枠内に直接アップロードしたい画像をドロップするか『ファイルを選択』をクリックします。

ここでは『ファイルを選択』をクリックします。



ul3
左図の様な画面が表示されます。

ポップアップされた画面に中からアップロードしたい画像の選択を行い、『開く』をクリックします。



ul4
左図の様な画面が表示されます。

※ リンクURL欄が空欄ですと画像アップローダーが正しく動作しませんので必ずご確認ください。



ul5
リンクURL欄が空欄の場合は『ファイルのURL』をクリックすると空欄に対象動画ファイルのURLが表示されます。

お好きなサイズを選択して『投稿に挿入』をクリックします。

※『配置』は使用しませんので気にしないでOKです。また、左下の『すべての変更を保存』ボタンはクリックしないでください。

※ TAテーマ001には挿入画像「リンク先」初期値を『ファイルのURL』に設定できる機能があります。詳しくはこちらをご覧ください。



左図の様な画面が表示されます。

※ 各設定ページの設定更新ボタンをクリックしないと登録は完了しないのでご注意ください。



各設定ページの設定更新ボタンをクリックすると左図の様な画面が表示され、画像のアップロードと挿入箇所とのリンク付け(登録)が完了します。

 

画像の削除

削除したい画像の設定画面で”画像無し”をクリックします。


※ ”更新すると登録されている画像URL情報は消去されます。”という警告文が出ます。

この時点ではまだ登録画像情報は削除されていません。再度削除して良いかの確認を行い、設定更新ボタンをクリックします。



登録画像情報が削除されました。

※ 挿入箇所とのリンク付け(登録)情報が削除されただけですのでWordPressのメディアとしては残っています。

ダイジェスト記事設定
最新投稿ダイジェスト(全ての投稿が対象)

実例

最新投稿ダイジェストに関する詳細設定です。

最新投稿ダイジェストタイトル

① 最新投稿ダイジェストタイトル

② 最新投稿ダイジェストタイトルの要素名

③ 最新投稿ダイジェストタイトル名

非対象カテゴリー

④ 非対象カテゴリー選択 ※ 最新投稿表示を行わないカテゴリーを選択します。

表示方法

⑤ 表示数 ※ 全数表示は-1を設定してください。

⑥ 全コンテンツ表示モード ※ 有効の場合、アイキャッチ画像はフルサイズになります。

⑦ 記事行間縦方向の距離

⑧ 記事列数

⑨ 記事列間横方向の距離 ※ 有効最大幅に対しての比率です。

ページャー

⑩ ページャー ※ 同一固定ページ内で複数のダイジェストページャーを使用すると互いの動作に意図しない影響を与えます。ダイジェストページャーの使用は同一ページ内で一つにすることをおすすめします。

記事境界線

⑪ 記事境界線 ※ コンテンツ間との余白挿入指示も兼ねます。

⑫ 記事境界線の種類

⑬ 記事境界線の太さ

⑭ 記事境界線の色

⑮ 記事境界線内の背景色

⑯ 記事境界とコンテンツの余白 ※ コンテンツと境界線の距離です。

 

各種投稿ダイジェスト

実例

各種投稿ダイジェストに関する詳細設定です。

カテゴリータイトル

① カテゴリータイトル

② カテゴリータイトルの要素名

③ カテゴリータイトルの一覧へのリンク

表示方法

④ 表示数 ※ 全数表示は-1を設定してください。

⑤ 全コンテンツ表示モード ※ 有効の場合、アイキャッチ画像はフルサイズになります。

⑥ 記事行間縦方向の距離

⑦ 記事列数

⑧ 記事列間横方向の距離 ※ 有効最大幅に対しての比率です。

一覧リンク

⑨ 一覧リンク表示

⑩ 一覧リンク表示名 ※ %cat%の箇所にカテゴリー名を表示させることができます。

⑪ 一覧リンク表示名の下線

⑫ 一覧リンク表示名のサイズ

⑬ 一覧リンク表示名の太さ

⑭ 一覧リンク表示名色

⑮ HOVER時の一覧リンク表示名色

⑯ 一覧リンク表示背景色

⑰ HOVER時の一覧リンク表示背景色

⑱ 一覧リンク表示背景の高さ

⑲ 一覧リンク表示背景の最小幅

⑳ 一覧リンク表示背景の角の丸み ※ 丸み無しは0を入力。

㉑ 一覧リンク表示のリスト下部との距離

ページャー

㉒ ページャー ※ 同一固定ページ内で複数のダイジェストページャーを使用すると互いの動作に意図しない影響を与えます。ダイジェストページャーの使用は同一ページ内で一つにすることをおすすめします。

記事境界線

㉓ 記事境界線 ※ コンテンツ間との余白挿入指示も兼ねます。

㉔ 記事境界線の種類

㉕ 記事境界線の太さ

㉖ 記事境界線の色

㉗ 記事境界線内の背景色

㉘ 記事境界とコンテンツの余白 ※ コンテンツと境界線の距離です。

ダイジェスト記事デザイン設定
『リンク時の新規ウィンドウ』、『日時カテゴリー・記事タイトルの表記』

ダイジェスト記事デザインの『リンク時の新規ウィンドウ』、『日時カテゴリー・記事タイトルの表記』に関する詳細設定です。

リンク時の新規ウィンドウ

① リンク時の新規ウィンドウ:チェックを入れるとダイジェスト記事で使用されているリンクページが新規ウィンドウで開きます。

日時カテゴリー・記事タイトルの表記

② 独立欄

③ コンテンツグループ上部

④ コンテンツグループ下部

※ それぞれのコンテンツの位置関係は左図右下の小図を参考にしてください。

 

『記事タイトル』、『日時カテゴリー』、『コンテンツグループ』

実例

ダイジェスト記事デザインの『記事タイトル』、『日時カテゴリー』、『コンテンツグループ』に関する詳細設定です。

記事タイトル

① 記事タイトルの要素名

日時カテゴリー

② 日時カテゴリー

③ 日時

④ カテゴリー

⑤ 日時文字の色

⑥ 日時文字のサイズ

⑦ 日時文字の太さ

⑧ 日時文字の時計マーク

⑨ カテゴリー文字のサイズ

⑩ カテゴリー文字の太さ

⑪ カテゴリー表示の高さ

⑫ カテゴリー表示の最小幅

⑬ カテゴリー表示の角の丸み ※ 丸み無しは0を入力してください。

コンテンツグループ

⑭ コンテンツグループ表示

⑮ コンテンツグループ画像の位置

⑯ コンテンツグループ画像の余白 ※ ⑮コンテンツグループ画像の位置に従って、左または右端からのPadding値を設定します。

⑰ コンテンツグループ画像のサイズ

⑱ コンテンツグループ抜粋文字数 ※ 非表示は0を設定してください。

⑲ コンテンツグループ抜粋枠の最小高さ ※ コンテンツグループ画像とサイズバランスを取るための設定です。

⑳ 抜粋文字の上部余白(padding処理です)

㉑ 抜粋文字の下部余白(padding処理です)

㉒ 抜粋文字装飾(共通設定 or 専用装飾):”専用装飾を使用する”にチェックを入れると㉓~㉙の設定が有効になります。

㉓ 専用装飾の抜粋文字サイズ

㉔ 専用装飾の抜粋文字太さ

㉕ 専用装飾の抜粋文字高さ(line-height処理です)

㉖ 専用装飾の抜粋文字色

㉗ 専用装飾の抜粋文字下線

㉘ HOVER時の専用装飾の抜粋文字色

㉙ HOVER時の専用装飾の抜粋文字下線

 

『右側続き誘導マーク』、『下側続き誘導マーク』、『新規投稿マーク』

実例

ダイジェスト記事デザインの『右側続き誘導マーク』、『下側続き誘導マーク』、『新規投稿マーク』に関する詳細設定です。

右側続き誘導マーク

① コンテンツグループ抜粋枠右側の続き誘導マーク(WordPressダッシュアイコンより)

② 右側続き誘導マークの色

③ 右側続き誘導マークのサイズ

④ 右側続き誘導マークの太さ

⑤ 右側続き誘導マークの表示幅

⑥ 右側続き誘導マークの透明度 ※ 0.0:透明 ~ 1.0:非透明の範囲で設定します。

⑦ 右側続き誘導マークのHOVER透明度 ※ 0.0:透明 ~ 1.0:非透明の範囲で設定します。

下側続き誘導マーク

⑧ コンテンツグループ抜粋下続き誘導マーク

⑨ 続き誘導マークの抜粋枠からの距離

⑩ 下側続き誘導マーク

⑪ 下側続き誘導マークのサイズ

⑫ 下側続き誘導マークの太さ

⑬ 下側続き誘導マーク色

⑭ 下側続き誘導マーク下線

⑮ HOVER時の下側続き誘導マーク色

⑯ HOVER時の下側続き誘導マーク下線

⑰ 下側続き誘導マーク背景色

⑱ HOVER時の下側続き誘導マーク背景色

⑲ 下側続き誘導マーク背景の高さ

⑳ 下側続き誘導マーク背景の最小幅

㉑ 下側続き誘導マーク背景の角の丸み ※ 丸み無しは0を入力してください。

新規投稿マーク

㉒ 新規投稿マーク

㉓ 新規投稿の日数定義 ※ 投稿日から何日間マークを表示するかの設定です。

㉔ 新規投稿マーク画像

㉕ 新規投稿マーク画像の代替テキスト ※ 画像がある場合は無効です。

㉖ 代替テキストの色

㉗ 代替テキストの太さ

㉘ 代替テキストの背景色

㉙ 代替テキスト背景の角の丸み ※ 丸み無しは0を入力してください。

㉚ 新規投稿マーク画像(代替テキスト)と記事タイトルの間隔

フリーエリア詳細設定
フリーエリア詳細設定

実例

freearea_detail2

フリーエリアに関する詳細設定です。

ここではトップページフリーエリアを使って説明します。他のフリーエリア(説明エリア)も同様です。

① トップページフリーエリアのタイトル表示共通設定 ※ 個別コンテンツ編集で異なる設定もできます。

② トップページフリーエリアのタイトル要素名共通設定 ※ 個別コンテンツ編集で異なる設定もできます。

③ カスタム投稿コンテンツ(TAトップFA)の表示順 ※ ステータスが“公開済み”のコンテンツが対象です。

 

フリーエリア(カスタム投稿)のリスト表示

左図はトップページフリーエリア(カスタム投稿)のリスト表示です。

”公開済み(実際の表示順に並び替えます)”をクリックすると実際に表示されるコンテンツが表示順にリストされます。

h2~h5タイトル(装飾1~装飾4)設定
シンプル

実例

h2~h5タイトル(装飾1~装飾4)のシンプルに関する詳細設定です。

ここではメインのh2設定を使って説明します。他の設定も同様です。

① ヘッドライン装飾タイプ:装飾タイプを選択します。※ PC設定のメイン以外ではメインの同ヘッドライン名(h2、h3など)と同じ設定内容を指定できます。

② 共通フォント設定:チェックを入れると文字色、リンク付文字色、文字下線の有無、HOVER色が共通フォント設定と同じになります。

③ 文字の色 ※ Ver.2.06 までは“文字の色”と“リンク付文字色”が共通でしたがVer.2.07から分離しました

④ リンク付文字色

⑤ リンク付文字色下線表示

⑥ リンク時の新規ウィンドウ(PCデザインのみの設定です)

⑦ HOVER時のリンク付文字色

⑧ HOVER時のリンク付文字下線表示

⑨ 文字のサイズ

⑩ 文字の高さ

※ “文字の高さ”は1.3em(文字自体の高さに30%の余白が付く)程度にするとバランスが良いです

※ タイトルの高さは“文字のサイズ”、“文字の高さ”、“装飾画像”に従って自動的に調整されます

⑪ 文字の左端からの位置

※ “文字の左端からの位置”の対象はタイトル前方の装飾画像も含みます

⑫ 文字の太さ

⑬ 文字のセンタリング

⑭ ヘッドラインの上側延長(padding処理です)

⑮ ヘッドラインの下側延長(padding処理です)

※ ヘッドラインの上下側延長は“文字の高さ”を大きく上回る余白(タイトルの延長)を上下非対称に付けることができます

⑯ ヘッドラインの上側余白(margin処理です)

⑰ ヘッドラインの下側余白(margin処理です)

※ ヘッドラインの上下側余白は隣接する上下のコンテンツとの距離を設定します(この余白はタイトルの延長にはなりません)

⑱ ヘッドライン上線 ※ 枠幅(100%)の線になります。

⑲ ヘッドライン上線の線種

⑳ ヘッドライン上線の太さ

㉑ ヘッドライン上線の色

㉒ ヘッドライン下線 ※ 枠幅(100%)の線になります。

㉓ ヘッドライン下線の線種

㉔ ヘッドライン下線の太さ

㉕ ヘッドライン下線の色

㉖ 装飾画像 ※ 装飾画像は実寸で反映されます

㉗ 装飾画像のレイアウト

※ 上線がグラデーション配色時のタイトル前方の装飾画像は反映されません。(上線を単色配色にしてください)

※ “背景ボックス(吹き出し#2)”のタイトル前方の装飾画像は反映されません。

㉘ タイトル背景時のX方向繰り返し

㉙ タイトル前方装飾画像とタイトルの間隔

㉚ タイトル前方装飾画像の位置 ※ 正の数字を入力すると下方向に、負の数字を入力すると上方向に移動します。

 

左縦線

実例

h2~h5タイトル(装飾1~装飾4)の左縦線に関する詳細設定です。

ここではメインのh2設定を使って説明します。他の設定も同様です。

① ヘッドライン装飾タイプ:装飾タイプを選択します。※ PC設定のメイン以外ではメインの同ヘッドライン名(h2、h3など)と同じ設定内容を指定できます。

② 共通フォント設定:チェックを入れると文字色、リンク付文字色、文字下線の有無、HOVER色が共通フォント設定と同じになります。

③ 文字の色 ※ Ver.2.06 までは“文字の色”と“リンク付文字色”が共通でしたがVer.2.07から分離しました

④ リンク付文字色

⑤ リンク付文字色下線表示

⑥ リンク時の新規ウィンドウ(PCデザインのみの設定です)

⑦ HOVER時のリンク付文字色

⑧ HOVER時のリンク付文字下線表示

⑨ 文字のサイズ

⑩ 文字の高さ

※ “文字の高さ”は1.3em(文字自体の高さに30%の余白が付く)程度にするとバランスが良いです

※ タイトルの高さは“文字のサイズ”、“文字の高さ”、“装飾画像”に従って自動的に調整されます

⑪ 文字の左端からの位置

※ “文字の左端からの位置”の対象はタイトル前方の装飾画像も含みます

⑫ 文字の太さ

⑬ 文字のセンタリング

⑭ ヘッドラインの上側延長(padding処理です)

⑮ ヘッドラインの下側延長(padding処理です)

※ ヘッドラインの上下側延長は“文字の高さ”を大きく上回る余白(タイトルの延長)を上下非対称に付けることができます

⑯ ヘッドラインの上側余白(margin処理です)

⑰ ヘッドラインの下側余白(margin処理です)

※ ヘッドラインの上下側余白は隣接する上下のコンテンツとの距離を設定します(この余白はタイトルの延長にはなりません)

⑱ ヘッドラインの左縦線の太さ

⑲ ヘッドライン左縦線の色

⑳ ヘッドライン上線 ※ 枠幅(100%)の線になります。

㉑ ヘッドライン上線の線種

㉒ ヘッドライン上線の太さ

㉓ ヘッドライン上線の色 ※ 左縦線の時は単色設定が採用されます

㉔ ヘッドライン下線 ※ 枠幅(100%)の線になります。

㉕ ヘッドライン下線の線種

㉖ ヘッドライン下線の太さ

㉗ ヘッドライン下線の色

㉘ 装飾画像 ※ 装飾画像は実寸で反映されます

㉙ 装飾画像のレイアウト

※ 上線がグラデーション配色時のタイトル前方の装飾画像は反映されません。(上線を単色配色にしてください)

※ “背景ボックス(吹き出し#2)”のタイトル前方の装飾画像は反映されません。

㉚ タイトル背景時のX方向繰り返し

㉛ タイトル前方装飾画像とタイトルの間隔

㉜ タイトル前方装飾画像の位置 ※ 正の数字を入力すると下方向に、負の数字を入力すると上方向に移動します。

 

背景ボックス

実例

h2~h5タイトル(装飾1~装飾4)の背景ボックスに関する詳細設定です。

ここではメインのh2設定を使って説明します。他の設定も同様です。

① ヘッドライン装飾タイプ:装飾タイプを選択します。※ PC設定のメイン以外ではメインの同ヘッドライン名(h2、h3など)と同じ設定内容を指定できます。

② 背景ボックスの色

③ 共通フォント設定:チェックを入れると文字色、リンク付文字色、文字下線の有無、HOVER色が共通フォント設定と同じになります。

④ 文字の色 ※ Ver.2.06 までは“文字の色”と“リンク付文字色”が共通でしたがVer.2.07から分離しました

⑤ リンク付文字色

⑥ リンク付文字色下線表示

⑦ リンク時の新規ウィンドウ(PCデザインのみの設定です)

⑧ HOVER時のリンク付文字色

⑨ HOVER時のリンク付文字下線表示

⑩ 文字のサイズ

⑪ 文字の高さ

※ “文字の高さ”は1.3em(文字自体の高さに30%の余白が付く)程度にするとバランスが良いです

※ タイトルの高さは“文字のサイズ”、“文字の高さ”、“装飾画像”に従って自動的に調整されます

⑫ 文字の左端からの位置

※ “文字の左端からの位置”の対象はタイトル前方の装飾画像も含みます

⑬ 文字の太さ

⑭ 文字のセンタリング

⑮ ヘッドラインの上側延長(padding処理です)

⑯ ヘッドラインの下側延長(padding処理です)

※ ヘッドラインの上下側延長は“文字の高さ”を大きく上回る余白(タイトルの延長)を上下非対称に付けることができます

⑰ ヘッドラインの上側余白(margin処理です)

⑱ ヘッドラインの下側余白(margin処理です)

※ ヘッドラインの上下側余白は隣接する上下のコンテンツとの距離を設定します(この余白はタイトルの延長にはなりません)

⑲ ヘッドライン上線 ※ 枠幅(100%)の線になります。

⑳ ヘッドライン上線の線種

㉑ ヘッドライン上線の太さ

㉒ ヘッドライン上線の色

㉓ ヘッドライン下線 ※ 枠幅(100%)の線になります。

㉔ ヘッドライン下線の線種

㉕ ヘッドライン下線の太さ

㉖ ヘッドライン下線の色

㉗ 背景ボックス角の丸み ※ 丸みを付けない場合は0を入力してください。また、グラデーションの上下線はボックスの丸みに追従しませんのでご留意ください

㉘ 装飾画像 ※ 装飾画像は実寸で反映されます

㉙ 装飾画像のレイアウト

※ 上線がグラデーション配色時のタイトル前方の装飾画像は反映されません。(上線を単色配色にしてください)

※ “背景ボックス(吹き出し#2)”のタイトル前方の装飾画像は反映されません。

㉚ タイトル背景時のX方向繰り返し

㉛ タイトル前方装飾画像とタイトルの間隔

㉜ タイトル前方装飾画像の位置 ※ 正の数字を入力すると下方向に、負の数字を入力すると上方向に移動します。

 

背景ボックス(吹き出し#1)

実例

h2~h5タイトル(装飾1~装飾4)の背景ボックス(吹き出し#1)に関する詳細設定です。

ここではメインのh2設定を使って説明します。他の設定も同様です。

① ヘッドライン装飾タイプ:装飾タイプを選択します。※ PC設定のメイン以外ではメインの同ヘッドライン名(h2、h3など)と同じ設定内容を指定できます。

② 背景ボックスの色

③ 共通フォント設定:チェックを入れると文字色、リンク付文字色、文字下線の有無、HOVER色が共通フォント設定と同じになります。

④ 文字の色 ※ Ver.2.06 までは“文字の色”と“リンク付文字色”が共通でしたがVer.2.07から分離しました

⑤ リンク付文字色

⑥ リンク付文字色下線表示

⑦ リンク時の新規ウィンドウ(PCデザインのみの設定です)

⑧ HOVER時のリンク付文字色

⑨ HOVER時のリンク付文字下線表示

⑩ 文字のサイズ

⑪ 文字の高さ

※ “文字の高さ”は1.3em(文字自体の高さに30%の余白が付く)程度にするとバランスが良いです

※ タイトルの高さは“文字のサイズ”、“文字の高さ”、“装飾画像”に従って自動的に調整されます

⑫ 文字の左端からの位置

※ “文字の左端からの位置”の対象はタイトル前方の装飾画像も含みます

⑬ 文字の太さ

⑭ 文字のセンタリング

⑮ ヘッドラインの上側延長(padding処理です)

⑯ ヘッドラインの下側延長(padding処理です)

※ ヘッドラインの上下側延長は“文字の高さ”を大きく上回る余白(タイトルの延長)を上下非対称に付けることができます

⑰ ヘッドラインの上側余白(margin処理です)

⑱ ヘッドラインの下側余白(margin処理です)

※ ヘッドラインの上下側余白は隣接する上下のコンテンツとの距離を設定します(この余白はタイトルの延長にはなりません)

⑲ 背景ボックス角の丸み ※ 丸みを付けない場合は0を入力してください。

⑳ 吹き出しの方向(吹き出し#1)※ 吹き出しの色は背景ボックスの色が採用されます。

㉑ 吹き出しの大きさ(吹き出し#1)

㉒ 吹き出しの左端からの位置(吹き出し#1)

㉓ 装飾画像 ※ 装飾画像は実寸で反映されます

㉔ 装飾画像のレイアウト

※ 上線がグラデーション配色時のタイトル前方の装飾画像は反映されません。(上線を単色配色にしてください)

※ “背景ボックス(吹き出し#2)”のタイトル前方の装飾画像は反映されません。

㉕ タイトル背景時のX方向繰り返し

㉖ タイトル前方装飾画像とタイトルの間隔

㉗ タイトル前方装飾画像の位置 ※ 正の数字を入力すると下方向に、負の数字を入力すると上方向に移動します。

 

背景ボックス(吹き出し#2)

実例

h2~h5タイトル(装飾1~装飾4)の背景ボックス(吹き出し#2)に関する詳細設定です。

ここではメインのh2設定を使って説明します。他の設定も同様です。

① ヘッドライン装飾タイプ:装飾タイプを選択します。※ PC設定のメイン以外ではメインの同ヘッドライン名(h2、h3など)と同じ設定内容を指定できます。

② 背景ボックスの色

③ 共通フォント設定:チェックを入れると文字色、リンク付文字色、文字下線の有無、HOVER色が共通フォント設定と同じになります。

④ 文字の色 ※ Ver.2.06 までは“文字の色”と“リンク付文字色”が共通でしたがVer.2.07から分離しました

⑤ リンク付文字色

⑥ リンク付文字色下線表示

⑦ リンク時の新規ウィンドウ(PCデザインのみの設定です)

⑧ HOVER時のリンク付文字色

⑨ HOVER時のリンク付文字下線表示

⑩ 文字のサイズ

⑪ 文字の高さ

※ “文字の高さ”は1.3em(文字自体の高さに30%の余白が付く)程度にするとバランスが良いです

※ タイトルの高さは“文字のサイズ”、“文字の高さ”、“装飾画像”に従って自動的に調整されます

⑫ 文字の左端からの位置

※ “文字の左端からの位置”の対象はタイトル前方の装飾画像も含みます

⑬ 文字の太さ

⑭ 文字のセンタリング

⑮ ヘッドラインの上側延長(padding処理です)

⑯ ヘッドラインの下側延長(padding処理です)

※ ヘッドラインの上下側延長は“文字の高さ”を大きく上回る余白(タイトルの延長)を上下非対称に付けることができます

⑰ ヘッドラインの上側余白(margin処理です)

⑱ ヘッドラインの下側余白(margin処理です)

※ ヘッドラインの上下側余白は隣接する上下のコンテンツとの距離を設定します(この余白はタイトルの延長にはなりません)

⑲ 背景ボックス角の丸み ※ 丸みを付けない場合は0を入力してください。

⑳ 吹き出しの方向(吹き出し#2)※ 吹き出しの色は背景ボックスの色が採用されます。

㉑ 吹き出しの大きさ(吹き出し#2)

㉒ 装飾画像 ※ 装飾画像は実寸で反映されます

㉓ 装飾画像のレイアウト

※ 上線がグラデーション配色時のタイトル前方の装飾画像は反映されません。(上線を単色配色にしてください)

※ “背景ボックス(吹き出し#2)”のタイトル前方の装飾画像は反映されません。

㉔ タイトル背景時のX方向繰り返し

㉕ タイトル前方装飾画像とタイトルの間隔

㉖ タイトル前方装飾画像の位置 ※ 正の数字を入力すると下方向に、負の数字を入力すると上方向に移動します。

固定ページ編集画面使用方法
固定ページ編集画面

固定ページ編集画面の使用方法の説明です。項目を入力して”更新”をクリックすると設定が確定します。

 

便利情報

固定ページ編集画面の便利情報について説明します。

① h2~h5のヘッドラインの使用方法の説明

② 修飾1~修飾4の使用方法の説明

③ メインコンテンツ間隔の使用方法の説明

④ メイン区切り線ショートコードの使用方法の簡易説明

⑤ ~ ⑦ 便利オリジナルショートコードの使用方法の簡易説明

 

コンテンツトップ余白設定

固定ページ編集画面のコンテンツトップ余白設定について説明します。

コンテンツトップ余白は固定ページ毎に設定できます。

① コンテンツトップ余白(マージン):”共通設定”以外を選択すると現在の固定ページのみの設定が有効になります。”コンテンツトップ余白設定値”を選択すると②で設定された値が採用されます。※ 当編集内容は先頭のコンテンツになるため『メインコンテンツ間隔設定』は自動的に0になります。余白を持たせたい場合には『コンテンツトップ余白共通設定値』を選択してください。

② コンテンツトップ余白(マージン)直接値設定

 

フレームタイプ

固定ページ編集画面のフレームタイプについて説明します。

フレームタイプは固定ページ毎に設定できます。

① フレームタイプ:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

 

基本パーツ表示

固定ページ編集画面の基本パーツ表示について説明します。

基本パーツ表示は固定ページ毎に設定できます。

① body背景画表示の設定:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

② ヘッダー部表示の設定:”カスタマイズ”を選択すると現在の固定ページのみの設定ができます。各項目は下記のチェック群で選択します。

③ ページタイトル表示の設定:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

④ フッター部表示の設定:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

⑤ 固定ページSNSボタン:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

 

固定ページSEO

固定ページ編集画面の固定ページOGPについて説明します。

SEOは固定ページ毎に設定できます。

① SEOキーワード:共通キーワードの前に追加されます。

② SEOディスクリプション:未入力の場合は共通ディスクリプションが採用されます。

③ h1表記

④ カノニカルタグ設定:設定しない場合はWordPressに登録されているドメインが採用されます。

 

固定ページOGP

固定ページ編集画面の固定ページOGPについて説明します。

OGPは固定ページ毎に設定できます。

① OGPタグ出力設定

② OGPタイトルの設定

③ OGPサイト名の設定

④ OGPディスクリプションの設定

⑤ OGP画像の設定

 

固定ページTwitter Cards

固定ページ編集画面の固定ページTwitter Cardsについて説明します。

Twitter Cardsは固定ページ毎に設定できます。

① Twitter Cardsタグ出力設定

② Twitter Cardsタイトルの設定

③ Twitter Cardsディスクリプションの設定

④ Twitter Cards画像の設定

 

固定ページのヘッダー画像設定(この固定ページのヘッダー画像)

実例

page_exp14

固定ページ編集画面の固定ページのヘッダー画像設定について説明します。

ヘッダー画像は固定ページ毎に設定できます。

① この固定ページのヘッダー画像:”共通設定のヘッダー画像”以外を選択すると現在の固定ページ専用のヘッダー画像が設定ができます。

② 専用ヘッダー画像

③ 専用ヘッダー画像のリンク

④ 専用ヘッダー用ショートコード:ここにはスライド表示等のプラグイン(例えばMeta Slider)のショートコードを記入します。

 

タイトル上のアイキャッチ画像

固定ページ編集画面のタイトル上のアイキャッチ画像について説明します。

タイトル上のアイキャッチ画像は固定ページ毎に設定できます。

① タイトル上のアイキャッチ画像:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。※ タイトルの上の画像は4:1の横長切り抜き画像になります。

 

固定ページの閲覧制限設定

固定ページ編集画面の固定ページの閲覧制限設定について説明します。

閲覧制限は固定ページ毎に設定できます。

① 固定ページの閲覧制限設定:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

 

サイトマップ掲載

固定ページ編集画面のサイトマップ掲載について説明します。

サイトマップ掲載は固定ページ毎に設定できます。

① サイトマップ掲載:チェックを入れるとテックエイドサイトマップの表示から除外されます。

 

インデックス・フォロー処理

固定ページ編集画面のインデックス・フォロー処理について説明します。

インデックス・フォロー処理は固定ページ毎に設定できます。※ この固定ページを検索エンジンの対象にするかどうかの設定です。(WordPress標準設定の『表示設定』⇒『検索エンジンでの表示』の設定が優先します)

① インデックス・フォロー処理

投稿記事編集画面使用方法
投稿記事編集画面

投稿記事編集画面の使用方法の説明です。項目を入力して”更新”をクリックすると設定が確定します。

 

便利情報

投稿記事編集画面の便利情報について説明します。

① h2~h5のヘッドラインの使用方法の説明

② 修飾1~修飾4の使用方法の説明

③ メインコンテンツ間隔の使用方法の説明

④ メイン区切り線ショートコードの使用方法の簡易説明

⑤ ~ ⑦ 便利オリジナルショートコードの使用方法の簡易説明

 

コンテンツトップ余白設定

投稿記事編集画面のコンテンツトップ余白設定について説明します。

コンテンツトップ余白は固定ページ毎に設定できます。

① コンテンツトップ余白(マージン):”共通設定”以外を選択すると現在の固定ページのみの設定が有効になります。”コンテンツトップ余白設定値”を選択すると②で設定された値が採用されます。※ 当編集内容は先頭のコンテンツになるため『メインコンテンツ間隔設定』は自動的に0になります。余白を持たせたい場合には『コンテンツトップ余白共通設定値』を選択してください。

② コンテンツトップ余白(マージン)直接値設定

 

フレームタイプ

投稿記事編集画面のフレームタイプについて説明します。

フレームタイプは固定ページ毎に設定できます。

① フレームタイプ:”共通設定”以外を選択すると現在の固定ページのみの設定ができます。

 

基本パーツ表示

投稿記事編集画面の基本パーツ表示について説明します。

基本パーツ表示は投稿記事毎に設定できます。

① body背景画表示の設定:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。

② ヘッダー部表示の設定:”カスタマイズ”を選択すると現在の投稿記事のみの設定ができます。各項目は下記のチェック群で選択します。

③ ページタイトル表示の設定:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。

④ フッター部表示の設定:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。

⑤ 投稿ページSNSボタン:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。

 

投稿ページSEO

投稿記事編集画面の投稿ページSEOについて説明します。

SEOは投稿記事毎に設定できます。

① SEOキーワード:共通キーワードの前に追加されます。

② SEOディスクリプション:未入力の場合は共通ディスクリプションが採用されます。

③ h1表記

④ カノニカルタグ設定:設定しない場合はWordPressに登録されているドメインが採用されます。

 

投稿ページOGP

投稿記事編集画面の投稿ページOGPについて説明します。

OGPは投稿記事毎に設定できます。

① OGPタグ出力設定

② OGPタイトルの設定

③ OGPサイト名の設定

④ OGPディスクリプションの設定

⑤ OGP画像の設定

 

投稿ページTwitter Cards

投稿記事編集画面の投稿ページTwitter Cardsについて説明します。

Twitter Cardsは投稿記事毎に設定できます。

① Twitter Cardsタグ出力設定

② Twitter Cardsタイトルの設定

③ Twitter Cardsディスクリプションの設定

④ Twitter Cards画像の設定

 

アイキャッチ画像のサイズと位置

投稿記事編集画面のアイキャッチ画像のサイズと位置について説明します。

アイキャッチ画像のサイズと位は投稿記事毎に設定できます。

① アイキャッチ画像のサイズ:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。※ サイズ設定に関わらず投稿枠の最大幅で制限されます。アイキャッチのサイズは、WordPress標準設定の『メディア』⇒『画像サイズ』で設定されます。

② アイキャッチ画像の位置:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。※ タイトルの上の画像は4:1の横長切り抜き画像になります。

 

投稿ページの閲覧制限設定

投稿記事編集画面の投稿ページの閲覧制限設定について説明します。

閲覧制限は投稿記事毎に設定できます。

① 投稿ページの閲覧制限設定:”共通設定”以外を選択すると現在の投稿記事のみの設定ができます。

 

インデックス・フォロー処理

投稿記事編集画面のインデックス・フォロー処理について説明します。

インデックス・フォロー処理は投稿記事毎に設定できます。※ この投稿記事を検索エンジンの対象にするかどうかの設定です。(WordPress標準設定の『表示設定』⇒『検索エンジンでの表示』の設定が優先します)

① インデックス・フォロー処理

カテゴリー編集画面使用方法
新規カテゴリーを追加

新規カテゴリー追加に関する設定です。

左図はカテゴリー設定ページの”新規カテゴリーを追加”画面の様子です。赤枠内がTAテーマ001用の設定項目です。

項目を入力して”新規カテゴリーを追加”ボタンをクリックすると設定が確定します。

① テックエイドサイトマップ表示:チェックを入れるとテックエイドサイトマップの表示から除外されます。

② カテゴリー背景カラー設定

③ カテゴリーテキストカラー設定

※ 上2色は投稿記事やダイジェストなどで表示されるカテゴリー名の装飾色です。

④ body背景画表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑤ ヘッダー部表示の設定:”カスタマイズ”を選択すると現在のカテゴリーのみの設定ができます。各項目は下記のチェック群⑥で選択します。

⑦ タイトル表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑧ フッター部表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑨ 一覧ページSNSボタン:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑩ カテゴリーの閲覧制限設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑪ このカテゴリーのヘッダー画像:”共通設定のヘッダー画像”以外を選択すると現在のカテゴリー(投稿記事、一覧ページ)専用のヘッダー画像が設定ができます。

⑫ 専用ヘッダー画像

⑬ 専用ヘッダー画像のリンク

⑭ 専用ヘッダー用ショートコード:ここにはスライド表示等のプラグイン(例えばMeta Slider)のショートコードを記入します。

 

カテゴリーの編集

カテゴリーの編集に関する設定です。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① テックエイドサイトマップ表示:チェックを入れるとテックエイドサイトマップの表示から除外されます。

② カテゴリー背景カラー設定

③ カテゴリーテキストカラー設定

※ 上2色は投稿記事やダイジェストなどで表示されるカテゴリー名の装飾色です。

④ body背景画表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑤ ヘッダー部表示の設定:”カスタマイズ”を選択すると現在のカテゴリーのみの設定ができます。各項目は下記のチェック群⑥で選択します。

⑦ タイトル表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑧ フッター部表示の設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑨ 一覧ページSNSボタン:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑩ カテゴリーの閲覧制限設定:”共通設定”以外を選択すると現在のカテゴリーのみの設定ができます。

⑪ このカテゴリーのヘッダー画像:”共通設定のヘッダー画像”以外を選択すると現在のカテゴリー(投稿記事、一覧ページ)専用のヘッダー画像が設定ができます。

⑫ 専用ヘッダー画像

⑬ 専用ヘッダー画像のリンク

⑭ 専用ヘッダー用ショートコード:ここにはスライド表示等のプラグイン(例えばMeta Slider)のショートコードを記入します。

フリーエリア使用方法

内容の編集

各フリーエリア編集画面の使用方法の説明です。

左図の様にTAテーマ001には全部で7つのフリーエリアがあります。それぞれのフリーエリアが以下の様にカスタム投稿タイプという通常の投稿記事の様なコンテンツ枠を持っています。

ヘッダーフリーエリア

カスタム投稿タイプ:TAヘッダーFA

トップページ説明エリア

カスタム投稿タイプ:TA説明エリア

トップページフリーエリア

カスタム投稿タイプ:TAトップFA
※ 無料版は2件まで表示可能

サイドバーフリーエリア

カスタム投稿タイプ:TAサイドFA
※ 無料版は2件まで表示可能

サブサイドバーフリーエリア

カスタム投稿タイプ:TAサブサイドFA

フッターフリーエリア

カスタム投稿タイプ:TAフッターFA

エンドロールフリーエリア

カスタム投稿タイプ:TAエンドロールFA

各カスタム投稿タイプをクリックすると投稿記事の様に既存コンテンツがリストされます。新規にコンテンツを作成する場合は”新規追加”で行います。(操作方法は投稿記事、固定ページと全く同様です)

投稿記事、固定ページと同じようにリスト内のコンテンツの”編集”をクリックするとコンテンツの編集画面に移動します。(左上図)

各フリーエリアカスタム投稿タイプの編集画面は投稿記事、固定ページと同じ操作のWordPress汎用操作枠とTAテーマ001特有の操作群に分かれます。以下にTAテーマ001特有の操作について説明を行います。

 

順序番号

順序番号(0以上の整数):フリーエリアコンテンツの表示順番を指定します。※ 順序番号は一覧表示のクイック編集からも設定可能です。

 

便利情報

ヘッドラインや修飾1~修飾4の使用方法の説明、オリジナルショートコードの使用方法の簡易説明等が記載されています。

 

基本設定

エンドロールフリーエリア

エンドロール以外のフリーエリア

基本設定はエンドロールフリーエリアのみ1項目多いだけで他は全て同じです。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① エンドロールフリーエリア表示の設定:”カスタマイズ”を選択すると現在のコンテンツのみの設定ができます。各項目は下記のチェック群で選択します。

② コンテンツトップ余白(マージン)”コンテンツトップ余白設定値”を選択した場合には③の値が採用されます。

③ コンテンツトップ余白設定値

④ フリーエリアのタイトルの表示設定:”共通設定”以外を選択すると現在のコンテンツのみの設定ができます。

⑤ フリーエリアのタイトル要素名設定:”共通設定”以外を選択すると現在のコンテンツのみの設定ができます。

 

バナー画像・付随文

実例

バナー画像・付随文は全てのフリーエリアで同じです。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① バナー画像

② バナー画像のリンク

③ バナー画像付随文

④ バナー画像付随文のリンク

⑤ バナー画像・付随文のセンタリング

⑥ 付随文の位置

⑦ 通常表示バナー画像の幅

⑧ レスポンシブデザインバナー画像の幅

⑨ バナー画像の左側余白

⑩ 付随文の左側余白

⑪ 付随文サイズ

⑫ 付随文の太さ

⑬ 付随文の下線(リンクがある場合)

⑭ 付随文の色

⑮ 付随文のHOVER色

⑯ 付随文の上余白(padding処理です)

⑰ 付随文の下余白(padding処理です)

 

サイドバーメニュー

実例

サイドバーメニューはサイドバーフリーエリアのみで使用できる機能です。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① WordPress標準のメニュー機能に関連付けを行っているTAサイドバーメニュー番号を一つ選択して出力します。

※ 無料版はTAサイドバーメニュー#1のみ使用できます。

 

コンテンツ枠の設定

実例

コンテンツ枠の設定は全てのフリーエリアで同じです。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① 通常表示コンテンツ枠幅

② レスポンシブデザインコンテンツ枠幅

③ 境界線の箇所 ※ コンテンツとの余白挿入箇所も兼ねます。

④ 境界線の種類

⑤ 境界線の太さ

⑥ 境界線の色

⑦ 境界線内の背景色

⑧ 境界の丸み

⑨ 境界線とコンテンツの余白

 

非表示ページ

非表示ページは複数のページに跨るフリーエリアの設定です。ヘッダー、サイドバー、サブサイドバー、フッターが対象です。(エンドロールフリーエリアは独自の選択機能がある)

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① フリーエリア・非表示ページ:コンテンツを非表示にしたいページにチェックを入れます。

 

レスポンシブ表示

レスポンシブ表示は全てのフリーエリアで同じです。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① フリーエリア・レスポンシブ表示:チェックを外すとレスポンシブ有効時に非表示になります。

 

通常(PC)表示

通常(PC)表示は全てのフリーエリアで同じです。

項目を入力して”更新”ボタンをクリックすると設定が確定します。

① PC時に表示する:チェックを外すとPC表示時に非表示になります。

  • LINEで送る


ta_thm001_downloadta_designing