[DRILL LANCER]

Lightningのデザインカスタマイズ設定で、H2に薄い灰色を使用していますが

上記が出力する CSS の方が class 一つ分強いので効いていないようです。

.entry-body h2 {
    line-height: 1.3;
    padding: 0.6em 4em 0.5em!important;
    background-color: white!important;
}

というようにすると解決できると思います。

• この返信は4年、 10ヶ月前にDRILL LANCERが編集しました。

[DRILL LANCER]

スキンは何をお使いですか？
私が試したところ II シリーズならどれでもOKなようでしたが・・・
下記ページの動画を参考にベースセクション設定機能を試してみてください。

【重要】Lightning Pro 3系 / Lightning 8系アップデートにおける注意点

[DRILL LANCER]

今現在、フッターウィジェットエリア2に｢VK お問い合わせ情報｣を
設定しているのですが、あまりこういった設定はしないものなのでしょうか？

今までトピックに上がってこなかった点から見るとあまりそういった使い方はされないようです。
なんとなく設置してみた→デザインが崩れた→じゃあやめよう
という感じで断念する方が多かったのかもしれませんが・・・

[DRILL LANCER]

サイドバーが必要なのか不要なのかはっきりとした回答を頂いておりませんので、
サイドバーは不要という前提で #30176 のコードを編集してみました。

.sideSection {
	display: none;
}

.mainSection-col-two {
	float: none;
	margin:0 auto;
	width: 100%;
}

@media (min-width: 992px) {
	.mainSection-col-one,
	.mainSection-col-two {
		max-width:730px;
		margin: 0 auto;
	}
}

@media (min-width: 1200px) {
	.mainSection-col-one,
	.mainSection-col-two {
		max-width:730px;
		margin: 0 auto;
	}
}

[DRILL LANCER]

右側の空白部分にはサイドバーが設置されるのですが、サイドバーは不要という解釈でよろしいでしょうか？
その場合、下記コードを適用すれば解決できると思います。

.sideSection {
	display: none;
}

.mainSection-col-two{
	float: none;
	margin:0 auto;
	width: 100%;
}

@media (min-width: 1200px){
	.mainSection-col-two{
		max-width:980px;
	}
}

• この返信は4年、 10ヶ月前にDRILL LANCERが編集しました。理由: コードが効かなかったので編集

[DRILL LANCER]

デザインスキン Frot Ⅱ Bootstrap4を設定すると
コピーライト部分のグレーの背景色が全幅になりません。

Fort II では下記コードを使用することで解決可能です。

.copySection {
	border-top: none;
	max-width: unset;
	background: #717071;
	padding: 20px;
}

因みに下記の違いがよくわかりません。

• Frot Ⅱ Bootstrap4
• Frot Ⅱ （Bootstrap4/footer light）表示保証外

フッターメニューとフッター部分(デフォルトだと３列表示)の背景色が黒っぽくなるか白になるかの違いがあります。

フッター部分に配置している会社情報の電話番号ボタンも位置がずれてしまいます。

「VK お問い合わせ情報」ウィジェットをサイドバーのような狭いエリアに設置するのは開発者側の想定外だったと思います。

ペールのように電話番号、問い合わせ番号を設置したい

しかし、一応下記コードでそれなりに体裁が整うと思います。

.siteFooter .sectionBox .veu_contact .contact_txt {
	float: none;
	text-align: center;
}
.siteFooter .sectionBox .veu_contact .contact_bt {
	float: none;
}

※私は開発者ではなくあくまでも利用者側の一人なので悪しからず。

[DRILL LANCER]

前回は１カラムのテンプレートを使用時に記事部分の幅を 980px にしたいという解釈でコーディングをしたので、あのようなコードになりました。

しかし、今回はサイト全体の幅を最大 980px にしたいということのようなので前回のコードは無用となります。

前回のコードを削除し、下記コードを適用することで実現可能になります。

@media (min-width: 1200px) {
	.siteHeadContainer.container .navbar-header,
	.gMenu_outer nav,
	.container{
		max-width:980px;
	}
}

前回と同じで Fort II 適用時に動作確認しました。

P.S.
この解釈が間違っているようならもっと詳しく説明をお願いします。

• この返信は4年、 10ヶ月前にDRILL LANCERが編集しました。

[DRILL LANCER]

モバイル用スライド画像を作成、設定したのですが。
表示されない状況です。サイズは750*530で作成しました

同じユーザー名の別の人が立てた下記トピックが参考になると思います。

[ 解決済 ] スライドショー　スマホだけ表示したい

あと、モバイル用画像は画面幅が一定以下の場合表示され、それ以外の場合は PC 用画像が表示される仕様のようです。

PC用のヘッダー画像はモバイル用に適用されない状況です。

ヘッダー画像 とはどこのことを指しているのかがわかりません。
ページヘッダー や ロゴ画像 にはそもそも PC と モバイルで出し分けする設定は見当たりませんし・・・

[DRILL LANCER]

Lightning ( Pro ) では下記コードが無いためかウィジェットでショートコードはデフォルトでは使えないようです。
add_filter('widget_text', 'do_shortcode' );
私の環境では上記コードを functions.php に追加したあとで カスタム HTML ウィジェット にショートコードを追加するだけで見た目は整いました。
スキンは II シリーズならどれでもOKなようでした。

P.S.
編集の前後で有耶無耶になってしまいましたが、トピ主は
<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">
が見当たらないと発言しているので少なくとも Lightning Pro 2.X.X 以下を使っている可能性がありそうです。

[DRILL LANCER]

Lightning Pro 3.0.3 ベースの専用のテンプレートを作ってみました。
専用のウィジェットを使用したい場合は下記コードを子テーマの functions.php に追記してください。

/*-------------------------------------------*/
/*	WidgetArea initiate
/*-------------------------------------------*/
function lightning_child_widgets_init() {
	
	// LP widget area

		$args  = array(
			'post_type'      => 'page',
			'post_status'    => 'publish,private,draft',
			'posts_per_page' => -1,
			'meta_key'       => '_wp_page_template',
			'meta_value'     => 'page-lp-english.php',
		);
		$posts = get_posts( $args );

	if ( $posts ) {
		foreach ( $posts as $key => $post ) {
			register_sidebar(
				array(
					/* Translators: %s: LP title */
					'name'          => sprintf( __( 'LP widget "%s"', 'lightning-pro' ), esc_html( $post->post_title ) ),
					'id'            => 'lp-widget-' . $post->ID,
					'before_widget' => '<div class="widget %2$s" id="%1$s">',
					'after_widget'  => '</div>',
					'before_title'  => '<h2 class="mainSection-title">',
					'after_title'   => '</h2>',
				)
			);
		}
	}
		wp_reset_postdata();
}
add_action( 'widgets_init', 'lightning_child_widgets_init', 200 );

Attachments:

You must be logged in to view attached files.

[DRILL LANCER]

すみません、色々と編集してました。最新のコードを参考にしてください。
Lightning Pro 3.0.X から引っ張ってきたコードなので、Lightning Pro 2.X.X 以下だと見つからないと思います。

【重要】Lightning Pro 3系 / Lightning 8系アップデートにおける注意点

[DRILL LANCER]

私だったら下記のように専用のテンプレートを作ってそれを適用します。

1. page-lp.php を子テーマにコピー後、page-english.php にリネーム
2. page-english.php を以下のように編集

編集前

<?php
/*
 * Template Name: Landing Page
 */
get_header(); ?>

<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">

編集後

<?php
/*
 * Template Name: English Landing Page
 */
get_header(); ?>

<?php echo do_shortcode( '[lightning_slide]' ); ?>
<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">

P.S.
他に修正すべき点が出てくるかもしれませんが、LP用ウィジェットを使用しないのなら問題なく使用できるでしょう。

P.P.S.
相手方は英語サイトは１ページだけ作らせておいて後は日本語版を見様見真似で作るという腹積もりかもしれないのでそのあたりはよく確認しておいたほうかもしれません。（その場合はマルチサイトが必須になると思います。）

Lightning ( Pro ) はトップページは色々設定できますが、その他のページは記事とサイドバー以外に自由度がないのでそういった可能性は個人的には否定できません。

[DRILL LANCER]

トップページが日本語、英語と全く同じデザインで必要となり質問させて頂きました。

固定ページにはページヘッダーとパンくずリストがもれなくついて来るので最低でも専用の固定ページテンプレートを作る必要がありそうです。

さすがに日本語サイトと英語サイトを別に作るのは大変ですか？
マルチサイトなり、サブドメインなりサブディレクトリなりで別にサイトを作った方が早そうな気がします。
（悩む時間を考慮すると手を動かした方が早そうな気がしたので・・・）

P.S.
Lightning の開発者の方へ：
Lightning には 英語版サイト と 日本語版サイト の両方がありますが、どのように作りましたか？

[DRILL LANCER]

前回と同様に下記コードをベースにカスタマイズしてください。
※前回のコードも含んでいるので前回のものは削除してください。

.mobile-fix-nav .mobile-fix-nav-menu li .vk-mobile-nav-menu-btn i,
.mobile-fix-nav .mobile-fix-nav-menu li .vk-mobile-nav-menu-btn svg,
.mobile-fix-nav .mobile-fix-nav-menu li a i,
.mobile-fix-nav .mobile-fix-nav-menu li a svg {
    font-size: 22px;
}

[DRILL LANCER]

モバイル固定ナビのアイコンのフォントサイズは下記 CSS コードで変更可能です。

.mobile-fix-nav .mobile-fix-nav-menu li a i {
	font-size: 22px;
}

下記のいずれかに追記してください。

• 子テーマの style.css
• 外観 ＞ カスタマイズ ＞ 追加CSS
• ExUnit ＞ CSS カスタマイズ

[投稿者]

投稿