コンテンツへスキップ ナビゲーションに移動
Zoom オンラインレッスン - WordPress の
カスタマイズ・設定をサポートします
詳しくはこちら
Lightning G3 / VK Blocks のカスタマイズ、TIPS
  • ホームHome
  • サイト案内Site Info
  • 賃貸物件Property
  • 料理Dishes
  • ブログBlog
  • お問合せInquiry
ブログ
  1. HOME
  2. ブログ
  3. カスタマイズ
  4. VK Post Author Display の投稿者プロフィールの画像のスタイル調整

VK Post Author Display の投稿者プロフィールの画像のスタイル調整

2022年4月11日(月)2022年4月13日(水)対馬 俊彦対馬 俊彦

VK Post Author Display で投稿者プロフィールを表示

このサイトでは、プラグイン VK Post Author Display を使って投稿者プロフィールを表示しています。

私のプロフィールに長々と文章を書いてあることもあって、プロフィール画像の下の余白(赤枠部分)が大きいのが気になります。

パソコンで見るときにはまだいいのですが、スマホで見たときに余白がかなり大きくて気になるので、CSS で以下のようにカスタマイズしてみました。

カスタマイズ前

カスタマイズ前

カスタマイズ後

カスタマイズ後

カスタマイズ手順

以下の CSS を追加します。

@media (max-width: 600px) {

#padSection {
    display: flex;
    flex-direction: column;
}

#padSection .avatar {
    float: none;
    text-align: center;
}

#padSection .avatar img {
    width: unset;
}

#padSection .profileTxtSet {
    margin-left: 0.2em;
}

#padSection .profileTxtSet dt {
    margin-bottom: 1.5em;
    text-align: center;
}

}

投稿者プロフィール

対馬 俊彦
対馬 俊彦魚沼情報サービス (新潟県南魚沼市)
WordPress を使用したサイト制作・カスタマイズを全国どこからでも承ります。ベクトルが販売している WordPress テーマ「Lightning」「Katawara」および同社のプラグイン「VK Blocks」「VK Filter Search」のカスタマイズを得意としています。遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを開設・運用する上で、うまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

このサイトで行っているカスタマイズのやり方の多くもマンツーマンのオンラインレッスン形式などでわかりやすく説明させていただくことができますので、興味がある方はご連絡ください。

* ドメインやサーバーの契約・申込み
* WordPress やテーマ、プラグインのインストール
* アクションフック・フィルターフック・jQuery・CSS によるカスタマイズ
* ドメインの移管・移転
* 日常の更新作業
なども含めて、サイトの制作・運用全般をお手伝いできます。

また、制作業者様のサイト制作のお手伝いも数多く行っております。いま人手が足りない、ちょっとここだけコーディングを頼みたい、等々… お仕事の依頼をお待ちしています。

ご要望をうかがった上で費用見積り(無料)を提示させていただきますので、お気軽にお問い合わせください。

» ご相談・お問い合わせはこちらからどうぞ
最新の投稿

この著者の記事一覧

  • Lightning G32023年9月4日ヘッダーに電話番号とボタンを追加したカスタマイズ例④
  • ExUnit2023年8月23日Font Awesome の Twitter のアイコンを鳥から X に変更してみた
  • アーカイブページの先頭にシェフの写真入り紹介を表示するようにカスタマイズしました。Lightning G32023年8月19日カスタム投稿タイプのアーカイブページのカスタマイズ例「おいしい料理」
  • Lightning G32023年8月18日Lightning のサイドバーに背景色を設定してみた

WordPress / Lightning オンラインサポートのご案内

サイトをご覧いただき、ありがとうございます。このサイトを運営している、魚沼情報サービスの対馬です。

WordPress を使用したサイト制作・カスタマイズ・サポートを全国どこからでも承っています。ベクトルが開発している WordPress テーマ「Lightning」「Katawara」および同社のプラグイン (VK Blocks Pro ・ VK Filter Search Pro) を使ったサイト制作・カスタマイズを最も得意としています。遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを開設・運用する上で、うまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

* ドメインやサーバーの契約・申込み
* WordPress やテーマ、プラグインのインストール
* アクションフック・フィルターフック・jQuery・CSS によるカスタマイズ
* ドメインの移管・移転
* 日常の更新作業
なども含めて、サイトの制作・運用全般をお手伝いできます。

* 近くに頼りになるところがない
* わからないところを教えてほしい
* 専門家にサイト制作を手伝ってもらいたい
という方はぜひお気軽にご相談ください。

ご要望をうかがった上で費用見積り(無料)を提示させていただきます。
ご相談・お問い合わせはお気軽にどうぞ
  • Facebook
  • X
  • Hatena
  • Pocket

こちらの記事もいかがですか

ヘッダーに電話番号とボタンを追加したカスタマイズ例④
 2023年9月4日
Lightning のサイドバーに背景色を設定してみた
 2023年8月18日
グローバルナビのマウスホバー効果のカスタマイズ例
 2023年8月6日
カスタマイズ後
カスタム投稿タイプ「賃貸物件」に設備のアイコンを追加しました
 2023年8月3日
イベントのカテゴリー、イベント名、開催日をページヘッダーに表示した例
 2023年6月21日
ヘッダーのロゴ画像とグローバルナビがフェードインするカスタマイズ例
 2023年5月21日
最寄駅ごとに賃貸物件のページヘッダー画像を切り替えたカスタマイズ例
 2023年5月11日
トップページ(固定ページ)に新着記事を表示する方法 - Lightning 無料版
 2023年4月9日
スライダーブロックの背景に動画を使用したカスタマイズ例 - VK Blocks
 2023年4月6日
NEW
標準投稿・カスタム投稿タイプの新着表示 - Lightning 無料版
 2023年3月6日
カスタマイズ
吹き出しブロックのアイコンを大きくしたカスタマイズ例 - VK Blocks
 2023年3月6日
カスタマイズ
上下左右に余白を持たせた全画面スライドショー - VK Blocks スライダー
 2023年3月1日
カテゴリー
カスタマイズその他
タグ
CSSVK Post Author Display
前の記事

register_block_style で追加したブロックスタイルの見本

2022年4月11日
カテゴリー
WordPressカスタマイズ
タグ
register_block_styleアクションフックカスタマイズ
この記事を読む
次の記事

Font Awesome 6 のスタイルいろいろ

2022年4月16日
カテゴリー
その他
タグ
Font AwesomeFont Awesome 6
この記事を読む
  • イベントカレンダー
  • 賃貸物件検索
  • かわいい動物たち
  • おいしい料理
lightning-g3-free-logo

WordPress の 100% GPL ライセンスのテーマ「Lightning G3 (無料版)」でいろいろと試しています。
役に立つ情報の発信もなるべくしようと心がけていますが、お客様に提示するカスタマイズ案のショーケースとして使ったり、自分の勉強・備忘録のために使ったり、動作確認でテスト投稿したり…というサイトなので、手順の説明などを詳しく載せていないものやナニコレ?的なものがあります。その点はご了承ください。

魚沼情報サービス https://uonuma-js.com/

Facebook page

従来の検索ウィジェット

検索ブロック (デフォルト)

検索ブロック (カスタマイズ)

Copyright © Lightning G3 / VK Blocks のカスタマイズ、TIPS     All Rights Reserved.

Powered by WordPress with Lightning Theme & VK All in One Expansion Unit by Vektor,Inc. technology.

Customized by Toshihiko Tsushima & Special Thanks to Vektor,Inc.

MENU

ただいまオープン記念キャンペーン中

50%OFF 10/5迄

会員登録

お申込みは電話またはネット予約でどうぞ

Tel 025-779-2843

ネット予約

100% GPL ライセンスの WordPress 無料テーマ
「Lightning G3」でいろいろと試しています。

  • ホームHome
  • このサイトについてAbout This Site
  • ブログBlog
  • お問い合わせInquiry
PAGE TOP