ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」

ワードプレステーマ別

スマホ

56
  • MAXX (TCD043)

TCDテーマMAXX:スマホ閲覧時、トップページのグリッド画像でコンテンツを最初から表示させる方法

Q.トップページをグリッド画像表示にしてスマホでみたとき、画像をタップする前からキャッチフレーズやボタンを表示させたい。A.下記にてご対応ください。外観>TCDテーマオプション>基本設定のカスタムCSSに下記を入力ください。▼修正前(キャッチフレーズなどは表示されていない)

  • AMORE (TCD028)

TCDテーマAMORE:スマホのトップページで「お知らせ一覧」ボタンの文言を変更する方法

Q.スマホでトップページを表示した際の「お知らせ一覧」ボタンの文言を変更したいA.下記の手順でカスタマイズしてください。編集するファイル:page-welcome.php編集する箇所: ↓↓↓「Older posts」の部分を任意の文字に変更ください。

  • SOURCE (TCD045)

TCDテーマSOURCE:スマホトップページの画像スライダーの高さを変更する方法

Q.スマホ表示でトップページ画像スライダーの縦幅が大きく、横が見切れるので調整したい。A.下記の方法でカスタマイズしてください。カスタムCSSに下記の内容を記載下さい。●に任意の値を設定ください。(デフォルトは90です)(補足)通常ですと、画面のスクロールに合わせてス

  • Bloom (TCD053)

TCDテーマBLOOM:スマホでのカードリンクの表示について

Q.カードリンクがスマートフォン表示時に、縦長に表示されてしまいます。対策方法はありますか。A.下記の方法でカスタマイズください。カードリンクはスマートフォン表示時に、文字数の関係上、縦長に表示される仕様でございます。回り込みを解除される場合は、大変申し訳ございませんが、カスタマイズが必

  • AMORE (TCD028)

TCDテーマAMORE:スマホにてヘッダーとフッターロゴの大きさを同じにする方法

Q.スマホにて、ヘッダーとフッターロゴの大きさを同じにするにはどうしたらよいでしょうか?A.下記のファイルを修正してください。下記の方法で該当ファイルを修正ください。修正ファイル:amore.css上記heightの値を変更してください。※スマホ用のヘッダ

  • VOGUE (TCD051)

TCDテーマVOGUE:スマホでのスライダー画像を全体表示する方法

Q.スマホでのスライダー画像を全体表示するにはどうしたらいいでしょうか?スマホ(iphone)でサイトを見た時に、トップページだけ画面右に縦に空きができて、トップ画像も縮小されず、一部分しか表示されません。A.下記の方法でカスタマイズください。スライダーの画像についてですが、

  • KADAN (TCD056)

TCDテーマKADAN:スマホにてトップページの見出しが長い場合の表示を改善する方法

Q.TOPページでHTMLタグを使用したいのですが可能でしょうか?トップページの「セクションコンテンツ」などの「ヘッダーのタイトル」と「見出し」について質問です。文章が長い場合は、フォントサイズを小さくするなどの対処法しかないでしょうか。「見出し」の方は改行は不可ですか?A.下記のカ

  • VOGUE (TCD051)

TCDテーマVOGUE:【スマホ】ヒーローヘッダーの表示を1枚のみに変更したい

Q.スマホでもトップページのヒーローヘッダーの表示を一枚だけにしたいのですが設定の仕方を教えてください。A.下記のカスタマイズをしてください。下記ファイルの該当箇所をご変更くださいませ。編集するファイル:template-parts/hero-header.php変更

  • GENSEN (TCD050)

TCDテーマGENSEN:スマホ表示時、トップページの紹介ページの抜粋を表示する方法

Q.スマホで表示した時、トップページの紹介ページの抜粋を表示したいです。A.カスタムCSSに追記してください。外観>TCDテーマオプション>基本設定にありますカスタムCSSに下記内容を記述してください。カスタマイズの際は必ずバックアップをご用意の上、お客様の責任に

  • KADAN (TCD056)

TCDテーマKADAN:モバイル用の見出しのフォントサイズを変更する

Q.下記箇所の「見出し」において、モバイルでのフォントサイズを変更することはできますか?①「トップページ」の「コンテンツビルダー」の「セクションコンテンツ」の「見出し」(画像左)②「固定ページ」の「テンプレート1」の「見出し」(画像右)     A.カスタムCSSに下記コードを追

  • MAG (TCD036)

TCDテーマMAG:ヘッダーのスマホ用ロゴ画像の大きさを調整する方法

Q.ヘッダーのスマホ用ロゴ画像を大きく表示する方法を教えてください。A.下記の方法で対応してください。外観>TCDテーマオプション>基本設定のカスタムCSSに入力してください。〇を任意の数値に変更してください。デフォルトは20pxです。スマホ表示時のヘッダーの高さが5

  • AVALON (TCD040)

TCDテーマAVALONのスマホのハンバーガーメニューの色変更

Q.スマホの最下部のフッターメニューを表示させたいスマホの画面上部のハンバーガー(三本線)メニューの色を変更する簡単な方法についてご説明します。A.該当ファイルを編集してください編集するファイル: responsive.css下記コードのcolorを変更することで配色

  • AGENT (TCD033)

TCDテーマAGENT:スマホ表示の追従ヘッダーの透明度を調整する

Q.TCDテーマAGENTの追従ヘッダーの透明度を調整したい「スマホのグローバルヘッダーの背景が透明なのを不透明か色を変えたいです。不透明なのは、どうしても見にくいのでこれはどうしても変更したいです。」とのことでしたので、そのカスタマイズ方法をご説明します。A.下記のph

  • CUBEY (TCD023)

TCDテーマCUBEYのスマホロゴテキストの文字サイズを変更する方法

Q.スマホロゴテキストのフォントサイズを変更したいCUBEYのスマホ表示では、テキストのみでサイトタイトルを表示する仕様だと思いますが、そのフォントサイズを変更したいA.下記のCSSファイルの該当箇所を編集します編集するファイル:responsive.css編集する箇所:

  • ORION (TCD037)

TCDテーマORIONのスマホ表示時に、ヘッダーを非表示にする方法

Q.ヘッダー画像を非表示にしたいパソコン表示の時は、ヘッダー画像を表示したいのですが、スマホ表示の時はヘッダー画像を非表示にしたい。A.下記のphpファイルの該当箇所を削除してください今回は、通常記事の場合でご説明致します。各ページともにファイルが異なりますので、ページによってご設定

  • AGENT (TCD033)

TCDテーマAGENT:ロゴの大きさをスマホだけ変更する方法

Q.スマホのみロゴの大きさを変更したいAGENTでは、PC・スマホともに同じロゴ画像が適用される仕様となっております。A.テーマオプションのカスタムCSS欄に下記コードを追記します〇に任意の数値(最大縦幅)を設定してください。デフォルトは20pxです。ロゴ画像の横幅は設定した最大

  • AMORE (TCD028)

TCDテーマAMORE:スマホ閲覧時のグローバルメニューを非表示にしたい

Q.スマホ閲覧時のメニューの非表示方法についてメニューの作成にあたって外部プラグインを使用したいのですが、メニューが2重で表示されてしまいます。デフォルトのメニューを非表示にすることは出来ますか?A.下記のphpファイルの該当箇所を編集してください編集するファイル:header.ph

  • Opinion (TCD018)

スマホ表示にて固定ページのタイトルが長い場合のカスタマイズ方法

Q.固定ページのタイトル見出しが長い場合スマホ表示がずれてしまう。Opinionでは固定ページのタイトルが長い場合、枠からはみ出て表示されてしまいます。修正する方法はありますか。A.下記のファイルを編集します編集するファイル:style_sp.css編集する箇所:

  • LAW (TCD031)

TCDテーマLAW・LUXE:スマホのみタップで電話をかけられるボタンを表示する

Q.トップページからワンタッチで電話をかけたいスマートフォンのトップページから、ワンタッチで電話を発信する事が出来れば、予約電話などもすぐにかけられるのですが、追加可能でしょうか。A.下記のphpファイルを編集しますスマートフォンでの表示の際にボタンをタップすると、そのまま電話が

  • Focus (TCD030)

TCDテーマFocus:記事詳細ページの広告の設定(ページ上部)をスマホでも表示する

Q.記事詳細ページの上部広告をスマートフォンで表示させたいテーマオプションの「記事詳細ページの広告の設定(ページ上部)」で設定した広告はPCでしか表示されないのでしょうか。スマホでの表示の仕方を教えてください。A.下記のphpファイルの該当箇所を編集します編集するファイル:conte

  • Precious (TCD019)

TCDテーマPrecious:スマホサイトとパソコンサイトで表示を分ける方法

Q.スマホのみバナーを非表示にしたいPCサイトでは、バナーを表示してスマホサイトではバナーを非表示にする方法はありますか?A.下記のファイルをご編集ください非表示する部分をif(!is_mobile()){・・・}で囲むとスマホでは非表示になります。スライダー下のバナーの場合

  • テーマ共通

埋め込み動画のレスポンシブ対応方法(YouTube等)

弊社テーマ自体は、ほとんどがレスポンシブ対応(一部未対応)となっておりますがYouTubeの埋め込み動画のサイズをレスポンシブに変更する機能はございません。その為、アップしたYouTube動画をスマホで見た場合、画面がはみ出てしまう事がございます。その場合は、下記のようにご編集ください。

  • VIEW (TCD032)

VIEWにてスマホ表示時にロゴ画像を表示する方法

Q.VIEWでもスマホ表示でロゴを画像にしたいスマホ表示時にスマホ用のヘッダーロゴ画像を表示するというカスタマイズ方法が解説されておりますが、VIEWにおいてはカスタマイズ方法が異なるようです。編集方法をおしえてください。A.下記の手順でcssファイルの該当箇所を編集してください編集

  • Precious (TCD019)

TCDテーマPrecious:スマホサイトでトップページスライダーを非表示にする方法

Q.スマホサイトではトップスライダーを表示しないようにするには?スマートフォンではデータ受信量の都合上、サイト表示が遅くなる可能性があります。そこでスマホサイト表示でのみトップページスライダーを非表示にしたいのですが、方法はありますか。A.下記のファイルをご編集くださいスライ