webLinx

フォーラムへの返信

14件の投稿を表示中 - 1 - 14件目 (全14件中)
  • 投稿者
    投稿

  • webLinx
    参加者

    回答ありがとうございました。
    設定が存在するのを知りませんでした。。。

    ありがとうございました!!


    webLinx
    参加者

    functions.phpに修正を行うことで、実現したいカスタマイズを実装することができました。
    ありがとうございました!!


    webLinx
    参加者

    >>おそらく
    >>
    >>1. 外観 > カスタマイズ > Lightning アーカイブ設定 で標準レイアウトを選択
    >>2. 子テーマに template-parts/post/ ディレクトリを作って loop-投稿タイプ名.php を配置
    >>3. loop-投稿タイプ名.php に一件分のコードを書く
    >>
    >>のが一番希望に添うものが作りやすいのではないかと思います。
    >>
    >>テキスト1カラム以外のレイアウトなら以下の方がおすすめです。
    誤っている場合は申し訳ございません。。。
    ご回答いただきました内容については、アーカイブページのカスタマイズになるかと存じます。

    今回はVK Blocks・Proのスレッドに質問させていただきましたので、質問の内容としては、
    【VK Blocks・Proの投稿リストの表示タイプ:テキスト1カラムで表示した際、カスタムフィールドの値も表示させたい】となり、カスタマイズ箇所が別のファイルではないかと思うのですが、いかがでしょうか。


    webLinx
    参加者

    >> 子テーマのサンプルの中にカスタム投稿タイプのアーカイブのサンプル
    >
    >こちらが何の事を指しているのか不明ですが、
    >手動で投稿タイプを追加するコードの事であれば
    >下記参照ください。
    module_loop_★ポストタイプ名★.php のサンプルファイルが、zipファイルにふくまれていることを期待していました。

    以前のbizvektorには存在していたようにおもいましたので。。。

    勘違いであれば申し訳ないです。


    webLinx
    参加者

    >>各SNSアイコンのURLは記入されていますか?
    設定はしておりません。
    おそらくですが、お客様の現状を考えるとSNSのURLについては設定しないまま公開となりそうです。

    ウィジェットのエビデンスを追加します。

    ウィジェット1
    ウィジェット2
    ウィジェット3

    >>該当サイトは開発中のものでまだ公開されていないURLですか?
    現在開発中ですので、公開はしておりません。


    webLinx
    参加者

    fujinaga様

    以前、まったく同じ現象が発生していたものです。
    私の場合は、以下の作業の流れで発生していました。

    1.無料のLightningを使用。
    2.無料のLightningのheader.phpをコピーして子テーマを作成
    3.Lightning Proに更新
    4.子テーマのheader.phpは無料のLightningのもののまま

    解決方法としては、子テーマのheader.phpを、
    Lightning Proのheader.phpをコピーすることで解決することができました。


    webLinx
    参加者

    設定内容は以下の通りです。

    ■使用テーマ
    使用テーマ

    ■関係しそうなプラグイン
    プラグイン1
    プラグイン2

    ■設定したウィジェット
    設定したウィジェット

    ■背景色の設定内容
    背景色の設定内容

    ■使用している画像
    使用している画像

    ■表示結果
    表示結果

    上記以外にエビデンスの必要な箇所がありましたら追加で取得し掲載いたします。


    webLinx
    参加者

    >>class=”table-responsive” をtableタグにではなく、tableの外側のdivに<div class=”table-responsive”> と書くと>>横スライドになります。
    >>(tableタグからは table-responsive ) は削除してください。
    ★スマホ表示の際に横スライドは求めていないため、table-responsiveは削除します。
     
    >>『レイアウト崩れ』とはどういう状態を指していますか?
    ★スマホ表示した場合にtype=fileのinputタグがテーブルタグの枠をはみ出します。
     type=fileのinputタグがテーブルタグの枠をはみ出したせいなのか、
     その他のinputタグもテーブルタグの枠をはみ出します。

    >>table {font-size:12px;}
    >>input[type=file] {width:300px;}
    ★input[type=file] {width:300px;}を使用しても変化はありませんでした。
     table {font-size:12px;}を使用したところ、BizVektorでtype=fileのinputタグを使用した際の表示と同じになりました。

    ■結果
    BizVektorの場合
    スマホ表示した場合、ContactForm7のinputタグのtype=fileのフォントサイズは12pxとなり、テーブルタグの枠をはみ出さない

    Lightningの場合
    スマホ表示した場合、ContactForm7のinputタグのtype=fileのフォントサイズは16pxとなり、テーブルタグの枠をはみ出すため、table {font-size:12px;}を記述する必要がある


    webLinx
    参加者

    以下のURLのページをスマホにてご確認ください。
    ※PC表示ではレイアウト崩れはおきません。

    http://weblinx01.xsrv.jp/dev_andoh-mitsuki.com/%E3%81%8A%E5%95%8F%E5%90%88%E3%81%9B%E3%83%BB%E3%81%94%E6%B3%A8%E6%96%87/

    一つ目のテーブル内にはファイルタグがありますが、
    二つ目のテーブルにはファイルタグがありません。

    Contact Form7のコードは以下の内容です。

    
    <h2>ファイルタグあり</h2>
    <table class="table table-responsive table-striped table-bordered mobile-block">
    	<tbody>
    		<tr>
    			<th>お名前</th>
    			<td>[text* your-name placeholder "お名前を入力してください"]</td>
            </tr>
    		<tr>
    			<th>メールアドレス</th>
    			<td>[email* your-mail placeholder "メールアドレスを入力してください"]</td>
    		</tr>
    		<tr>
    			<th>電話番号</th>
    			<td>[tel* tel placeholder "電話番号を入力してください"]</td>
    		</tr>
    		<tr>
    			<th>郵便番号</th>
    			<td>[text zip class:p-postal-code minlength:8 size:8 placeholder "郵便番号を入力して下さい"]</td>
    		</tr>
    		<tr>
    			<th>住所</th>
    			<td>[text address class:p-region class:p-locality class:p-street-address class:p-extended-address placeholder "住所を入力して下さい"]</td>
    		</tr>
    		<tr>
    			<th>写真1</th>
    			<td>[file file-01]</td>
    		</tr>
    		<tr>
    			<th>写真2</th>
    			<td>[file file-02]</td>
    		</tr>
    		<tr>
    			<th>写真3</th>
    			<td>[file file-03]</td>
    		</tr>
    		<tr>
    			<th>お問い合わせ内容</th>
    			<td>[textarea your-message placeholder "お問い合わせ内容を入力してください"]</td>
    		</tr>
    	</tbody>
    </table>
    
    <h2>ファイルタグなし</h2>
    <table class="table table-responsive table-striped table-bordered mobile-block">
    	<tbody>
    		<tr>
    			<th>お名前</th>
    			<td>[text* your-name placeholder "お名前を入力してください"]</td>
            </tr>
    		<tr>
    			<th>メールアドレス</th>
    			<td>[email* your-mail placeholder "メールアドレスを入力してください"]</td>
    		</tr>
    		<tr>
    			<th>電話番号</th>
    			<td>[tel* tel placeholder "電話番号を入力してください"]</td>
    		</tr>
    		<tr>
    			<th>郵便番号</th>
    			<td>[text zip class:p-postal-code minlength:8 size:8 placeholder "郵便番号を入力して下さい"]</td>
    		</tr>
    		<tr>
    			<th>住所</th>
    			<td>[text address class:p-region class:p-locality class:p-street-address class:p-extended-address placeholder "住所を入力して下さい"]</td>
    		</tr>
    		<tr>
    			<th>お問い合わせ内容</th>
    			<td>[textarea your-message placeholder "お問い合わせ内容を入力してください"]</td>
    		</tr>
    	</tbody>
    </table>

    >>画面が狭い時にテーブルを横にスライドする事はできますか?
    テーブルを横にスライドするようには見えないです。


    webLinx
    参加者

    ご連絡ありがとうございます。

    以下のコードを記述してみましたが、スマホ用のCSSはやはり当たっておらず、
    レイアウトが崩れております。

    
    <div class="table-responsive">
      <table class="table table-striped table-bordered">
        <tbody>
          <tr>
            <th>写真1</th>
            <td>[file file-01]</td>
          </tr>
        </tbody>
      </table>
    </div>

    ほかになにか原因がありますでしょうか。


    webLinx
    参加者

    修正対応ありがとうございます。
    プラグインを更新し、確認いたしました。

    スライダー画像の見切れはなくなっておりました。

    あと2点確認なのですが、
    1.スマホ表示時に、サイトタイトルのfont-sizeが32pxは大きすぎるのでは?
    2.ウィジェット:サイドバーのどれかに登録されるはずのウィジェット設定内容が、ウィジェット:トップページコンテンツエリア右に設定されているのでは?

    こちらについては、Lightning Skin Fort の修正ではなく、
    Lightning Proの修正となるのでしょうか。


    webLinx
    参加者

    テーマ
    Lightning Pro 0.1.2

    プラグイン
    Akismet Anti-Spam 4.0.8
    Lightning Skin Fort 3.0.3
    TypeSquare Webfonts for エックスサーバー 1.1.0
    VK All in One Expansion Unit 6.6.8
    WP Multibyte Patch 2.8.1

    にて新しく環境を作成しました。

    作成手順は、Xサーバの簡単インストールからwordpressをインストールし、
    その後、上記のテーマとプラグインをインストール、有効化したのみです。

    http://weblinx01.xsrv.jp/demodemo001/

    ↑のURLをスマホでご確認ください。

    PC時でもスマホ時でも.navbar-brandのfont-size: 32pxが適用されており、
    スマホ時はかなり文字が大きく感じます。

    また、新しく環境を作成して気がついたのですが、
    おそらくウィジェット:サイドバーのどれかに登録されるはずのウィジェット設定内容が、
    ウィジェット:トップページコンテンツエリア右に設定されています。

    こちらについても上記のURLでご確認ください。


    webLinx
    参加者

    デザインスキンはLightning Skin Fortの3.0.3を使用しています。


    webLinx
    参加者

    言葉足らずで申し訳ありません。

    この現象はスマホで閲覧した際に発生しています。

14件の投稿を表示中 - 1 - 14件目 (全14件中)