VWSとは フォーラム Lightning [ 解決済 ] 子ページ一覧アイキャッチ画像サイズ変更

[ 解決済 ] 子ページ一覧アイキャッチ画像サイズ変更

  • このトピックには9件の返信、2人の参加者があり、最後にkinkaifoodsにより3週、 1日前に更新されました。
10件の投稿を表示中 - 1 - 10件目 (全10件中)
  • 投稿者
    投稿
  • #43579

    kinkaifoods
    参加者

    →Lightning Pro child
    →Origin Ⅱ

    タイトルそのままですが、子ページ一覧アイキャッチ画像サイズ変更は可能でしょうか?テキスト数・フォントサイズも変更できるといいです。いかがでしょうか?

    #43692

    うなこ
    モデレーター

    プラグインVK Blocks Proの子ページリストブロックで、表示タイプがいろいろ選択できます。
    アイキャッチ画像も、カードタイプを選択しますと大きく表示できます。
    選択する表示タイプによりcssのクラス名が変わりますので、まずはこちらの表示タイプを選んでいただき、
    フォントサイズを調整する形になるかと思います。

    子ページリスト(Pro版のみ)

    cssのカスタマイズは、こちらのサイトが参考になると思います。

    全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

    #43708

    kinkaifoods
    参加者

    固定ページは操作できますが、外観>カスタマイズ>ウィジェット>TOPページコンテンツエリア部にVK固定ページ本文を設置し、子ページ一覧の表示をチェックしていますが、それ自体は編集可能でしょうか?

    #43792

    うなこ
    モデレーター

    はい、cssでカスタマイズ可能です。

    トップページのみに適応させたい場合は以下のクラス名に対してサイズを調整してみてください。
    トップページのみではなくて全ページで適応させたい場合は上の.home のクラス名を削除してください。

    /* HOMEのみ 子ページアイキャッチ画像 */

    .home .veu_childPage_list .wp-post-image{
    width: ○○;
    }

    /* HOMEのみ 子ページタイトル */

    .home .veu_card .veu_card_title{
    font-size: ○○px;
    }

    /* HOMEのみ 子ページ文章 */

    .home .veu_childPage_list .childPage_list_text{
    font-size:○○px;
    }
    #43904

    kinkaifoods
    参加者

    ブロック:子ページリスト(pro)

    VK ALL in one expansion unit:挿入アイテムの設定>子ページ一覧の表示
    があるようですね。私がお話ししていたのは後者のほうでした。

    別ページで、前者の方でリストを表示させてみましたが、サムネイルが大きすぎるのと抜粋の文章が長すぎるのでその調整のCSSがあるとありがたいです。その場合そのブロックの高度な設定>追加CSSクラスに挿入すればいいでしょうか?

    #43918

    うなこ
    モデレーター

    別ページで、前者の方でリストを表示させてみましたが、サムネイルが大きすぎるのと抜粋の文章が長すぎるのでその調整のCSSがあるとありがたいです。その場合そのブロックの高度な設定>追加CSSクラスに挿入すればいいでしょうか?

    こちらはcssのクラス名を追加する場所になります。
    少量のcssを追加する場合はカスタマイズの追加CSSに記述してください。

    cssのカスタマイズが多い場合は、子テーマで作成したほうが作りやすいと思います。

    CSSの記述場所は、こちらのページにも説明がありますので、よろしければ参考にしてみてください。

    全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

    #43965

    うなこ
    モデレーター

    別ページで、前者の方でリストを表示させてみましたが、サムネイルが大きすぎるのと抜粋の文章が長すぎるのでその調整のCSSがあるとありがたいです。

    こちらの抜粋の件は、該当の子ページの編集画面から文字数を調整可能です。
    右に抜粋の項目がありますので、抜粋を入力 (任意)の個所に好きな文字を入れて更新してください。(添付画像参照)

    サムネイルの大きさの件は、子ページリストの表示タイプによってcssクラス名が変わりますので、
    まずはどの表示タイプで実装するかを教えてください。
    (表示タイプは、カード、カード水平、メディア、テキスト1カラムの4種類あります。)

    Attachments:
    You must be logged in to view attached files.
    #43977

    kinkaifoods
    参加者

    /* HOMEのみ 子ページ文章 */

    .home .veu_childPage_list .childPage_list_text{
    font-size:○○px;
    }

    上記機能しましたが、フォントサイズを大きくすると枠も大きくなりました。文章量を少なくできますでしょうか?

    /* HOMEのみ 子ページアイキャッチ画像 */

    .home .veu_childPage_list .wp-post-image{
    width: ○○;
    }

    アイキャッチ画像は枠の幅が決まっているせいか、拡大も縮小もできない感じです。

    よろしくお願いします。

    #44012

    うなこ
    モデレーター

    上記機能しましたが、フォントサイズを大きくすると枠も大きくなりました。文章量を少なくできますでしょうか?

    ⇒こちらの件は抜粋の文字になりますので、
    該当の子ページの編集画面から文字数を調整可能です。
    右に抜粋の項目がありますので、抜粋を入力 (任意)の個所に好きな文字を入れて更新してください。(添付画像参照)

    アイキャッチ画像は枠の幅が決まっているせいか、拡大も縮小もできない感じです。

    ⇒アイキャッチ画像の件は、ためしに以下のcssでサイズは変わりますか?

    /* HOMEのみ 子ページアイキャッチ画像 */

    .home .veu_childPage_list .wp-post-image{
    width: 20%;
    }

    /* 子ページアイキャッチ画像 */

    .veu_childPage_list .wp-post-image{
    width: 20%;
    }
    • この返信は3週、 5日前にうなこが編集しました。
    • この返信は3週、 5日前にうなこが編集しました。
    Attachments:
    You must be logged in to view attached files.
    #44163

    kinkaifoods
    参加者

    ご対応ありがとうございました。

10件の投稿を表示中 - 1 - 10件目 (全10件中)
  • このトピックに返信するにはログインが必要です。