<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Lightning &#8211; 初心者のためのワードプレステーマ教室｜評判・感想も丁寧に解説！</title>
	<atom:link href="https://blognote01.com/category/%E7%84%A1%E6%96%99wordpress%E3%83%86%E3%83%BC%E3%83%9E%E3%80%90%E8%A9%95%E5%88%A4%E3%83%BB%E6%84%9F%E6%83%B3%E3%80%91/lightning/feed" rel="self" type="application/rss+xml" />
	<link>https://blognote01.com</link>
	<description>Wordpressテーマの評判や感想、機能を解説</description>
	<lastBuildDate>Tue, 24 Jan 2023 08:45:20 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	

<image>
	<url>https://blognote01.com/wp-content/uploads/2019/06/cropped-daiya-32x32.png</url>
	<title>Lightning &#8211; 初心者のためのワードプレステーマ教室｜評判・感想も丁寧に解説！</title>
	<link>https://blognote01.com</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Lightningのメニューのカスタマイズ！位置調整やフッターやモバイルも！（WordPressテーマ）　</title>
		<link>https://blognote01.com/lightning-menu</link>
					<comments>https://blognote01.com/lightning-menu#respond</comments>
		
		<dc:creator><![CDATA[なつ]]></dc:creator>
		<pubDate>Fri, 09 Jul 2021 10:34:56 +0000</pubDate>
				<category><![CDATA[Lightning]]></category>
		<category><![CDATA[無料Wordpressテーマ【評判・感想】]]></category>
		<guid isPermaLink="false">https://blognote01.com/?p=15736</guid>

					<description><![CDATA[ブログ運営半年で月20万超の元サラリーマンブロガーなつです。 LightningはとてもシンプルなWordpressテーマです。専用のプラグインをインストールして機能を拡張してもいいですし、実際は導入しなくてもブログの作...]]></description>
										<content:encoded><![CDATA[<p>ブログ運営半年で月20万超の元サラリーマンブロガーなつです。</p>
<p>LightningはとてもシンプルなWordpressテーマです。専用のプラグインをインストールして機能を拡張してもいいですし、実際は導入しなくてもブログの作成はできます。</p>
<p>ブログを作って項目やカテゴリーが増えてきたらブログの上部で<a href="https://blognote01.com/wordpress-globalmenu" target="_blank" rel="noopener">グローバルメニュー</a>を作ったりフッターでメニューを配置したりします。</p>
<p>Lightningのメニューの超シンプルな設定方法をお伝えしていきます。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>　<span style="font-size: 14pt;"><strong>2023年、話題のワードプレステーマ「THE THOR」</strong></span><br />
<strong>⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE・THORの公式ページを確認する。</a></strong></p>
<p>※　今なら、8大購入特典をプレゼント！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-hyouban"><figure class="eyecatch of-cover thum"><img fetchpriority="high" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2019/07/thorkutikomi-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの評判】実際使ってみた口コミとレビュー。</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>Lightning（Wordpressテーマ）のメニュー配置位置　3種類</h2>
<p>Lightningのメニューの設置は、PC画面で2か所、スマホ画面1か所の配置調整ができるようになっています。</p>
<p>シンプルですが、とても見やすいメニューです。「ヘッダー画像の上」「フッター」に配置ができます。</p>
<p>スマホ画面の場合は、モバイルナビゲーションになります。</p>
<ul>
<li>Header Navigation（ヘッダーのメニュー）</li>
<li><label for="locations-Footer">Footer Navigation（フッターのメニュー）</label></li>
<li>Mobile Navigation（スマホのメニュー）</li>
</ul>
<p>&nbsp;</p>
<h3>Header Navigation（ヘッダーのメニュー）</h3>
<p>Header Navigationはヘッダー画像を設置した場合にその上に配置されるメニューです。追随型なので下にスクロールしていくとメニューが上部に出てきます。</p>
<p>シンプルですがとても見やすいメニューです。</p>
<img decoding="async" class="alignnone wp-image-15740 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu3.jpg" alt="" width="500" height="223" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu3.jpg 500w, https://blognote01.com/wp-content/uploads/2021/07/limenu3-300x134.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/limenu3-485x216.jpg 485w" sizes="(max-width: 500px) 100vw, 500px" />
<p>&nbsp;</p>
<h3>Footer Navigation（フッターのメニュー）</h3>
<p>Footer Navigationは名前の通りフッター部分に配置されるメニューです。記事を読み終えたユーザーに次のカテゴリーに誘導したい場合にも使えます。</p>
<img decoding="async" class="alignnone wp-image-15739 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu2.jpg" alt="" width="500" height="253" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu2.jpg 500w, https://blognote01.com/wp-content/uploads/2021/07/limenu2-300x152.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/limenu2-485x245.jpg 485w" sizes="(max-width: 500px) 100vw, 500px" />
<p>&nbsp;</p>
<p>&nbsp;</p>
<div class="cbox intitle is-style-red_box type_normal"><div class="box_title"><span class="span__box_title">THE THORオリジナルデザインプレゼント中！</span></div><div class="cboxcomment"><strong>当ブログのTHE THORオリジナルテンプレート！</strong></p>
<p>このブログからTHE THORをご購入くださった方に<strong>マニュアル</strong>をプレゼントしています。</p>
<p><div class="column-wrap "><br />
<div class="column_3 child_column "><a href="http://blognote01.com/cafe/" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-9544" src="https://blognote01.com/wp-content/uploads/2020/04/torlwata-300x221.jpg" alt="THE THOR特典デザイン「綿毛」" width="300" height="221" srcset="https://blognote01.com/wp-content/uploads/2020/04/torlwata-300x221.jpg 300w, https://blognote01.com/wp-content/uploads/2020/04/torlwata.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
追加特典「<a href="http://blognote01.com/cafe/" target="_blank" rel="noopener">綿毛</a>」</div><br />
<div class="column_3 child_column "><a href="http://blognote01.com/thethorsimple" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-5560" src="https://blognote01.com/wp-content/uploads/2019/11/sinpuru2-300x263.jpg" alt="THE THOR特典デザイン「シンプル」" width="300" height="263" srcset="https://blognote01.com/wp-content/uploads/2019/11/sinpuru2-300x263.jpg 300w, https://blognote01.com/wp-content/uploads/2019/11/sinpuru2.jpg 648w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
特典「<a href="http://blognote01.com/thethorsimple" target="_blank" rel="noopener">シンプル</a>」</div><br />
<div class="column_3 child_column "><a href="http://blognote01.com/restaurant/" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-9541" src="https://blognote01.com/wp-content/uploads/2020/04/torlresut-300x226.jpg" alt="THE" width="300" height="226" srcset="https://blognote01.com/wp-content/uploads/2020/04/torlresut-300x226.jpg 300w, https://blognote01.com/wp-content/uploads/2020/04/torlresut.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
追加特典「<a href="http://blognote01.com/restaurant/" target="_blank" rel="noopener">ai</a>」</div> </div></p>
<p>※他のデザインは以下の記事で見れますので覧ください。<br />
⇒<a href="https://blognote01.com/thethor-design6" target="_blank" rel="noopener noreferrer">【簡単】THE THORデザインの事例集6選！初心者でも作れるアレンジを紹介！</a></p>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a class="btn__link btn__link-primary wp-block-button__link" href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1">特典付きでTHE THORを購入する</a></div></p>
<p><center>／／今なら、なつ特製オリジナルデザインマニュアル付き！＼＼</center><center></center><center></center><center></center><br />
<span style="font-size: 10pt;">※ヘッダーの画像は、写真ACとイラストACのイラストレーターさん方の作品です。特典内でURLをお伝えしています。</span></div></div>

<p>&nbsp;</p>
<p>※ヘッダーの画像は、写真ACとイラストACのイラストレーターさん方の作品です。特典内でURLをお伝えしています。</p>
<h3>Mobile Navigation（スマホのメニュー）</h3>
<p>Mobile Navigationはスマホ等の小さな画面で案内として出てくるメニューです。展開すると項目が出てきます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15738 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu.jpg" alt="" width="250" height="390" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu.jpg 250w, https://blognote01.com/wp-content/uploads/2021/07/limenu-192x300.jpg 192w" sizes="(max-width: 250px) 100vw, 250px" />
<p>&nbsp;</p>
<h2>グローバルメニューとは</h2>
<p>超初心者の方の中には、グローバルメニューとメニューが混同してしまう方もおられると思います。そこで簡単にお伝えすると、メニューはWordpressテーマを導入すると設定できる部分で、<strong><span style="color: #be3144;">グローバルメニューとは上部に配置されるメニューのことです。</span></strong></p>
<p>基本的にはほとんどのテーマで設定できるようになっています。</p>
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2020/06/Tmenu10.jpg" alt="" width="500" height="216" class="alignnone wp-image-10705 size-full" srcset="https://blognote01.com/wp-content/uploads/2020/06/Tmenu10.jpg 500w, https://blognote01.com/wp-content/uploads/2020/06/Tmenu10-300x130.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p>出典：THE THOR記事</p>
<div class="cbox is-style-glay_box type_normal"><div class="cboxcomment">
<p>メニュー＞グローバルメニュー</p>
</div></div>
<p>メニューを構成するときに、ブログのどこに表示させるのか設定項目があります。そこでグローバルメニューとして設定します。</p>
<p>&nbsp;</p>
<h2>Lightningのメニューカスタマイズ　1.　「メニュー作成」</h2>
<p>WordPressテーマにはメニューを作る機能があります。基本の作り方は他と同じなのでわかる方は飛ばしてくださいね。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　メニュー</span></p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-13325 size-full" src="https://blognote01.com/wp-content/uploads/2021/01/amenu.jpg" alt="" width="500" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/01/amenu.jpg 500w, https://blognote01.com/wp-content/uploads/2021/01/amenu-300x180.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<h3>メニューを作る順序</h3>
<p>メニューを作るのは以下の3段階で作ります。</p>
<ol>
<li>メニューのタイトルを入力する</li>
<li>メニュー項目をメニュー構造に配置</li>
<li>メニュー設定で位置にチェック</li>
</ol>
<p>&nbsp;</p>
<p>「新しいメニューを作成しましょう」というリンクをクリックしタイトルを入力します。（追加でメニューを作る場合）</p>
<p>左側にあるメニュー項目を右のメニュー構造に追加していきます。（この部分で階層などの設定もできますのでドラッグ＆ドロップなどしながら確認してみてください）</p>
<p>メニュー設定で配置したい位置にチェックを入れ最後に「メニューを保存」をクリックします。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>  <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」！</strong></span><br />
⇒<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する</a><br />
※今なら、8大購入特典をお付けしています！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>Lightningのメニューカスタマイズ　2.　「カスタマイザーで配置」</h2>
<p>上記のやり方でメニュー設定は完了なのですが、カスタマイザでも調整できますので、ここで説明をしておきます。</p>
<p>※メニュー自体は作ってあることが前提となります。前章でまずはメニューを作ってください。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　メニュー</span></p>
<p>もし、メニューがすでに設定されていれば以下のような形となります。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15743" src="https://blognote01.com/wp-content/uploads/2021/07/limenu4-183x300.jpg" alt="" width="183" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu4-183x300.jpg 183w, https://blognote01.com/wp-content/uploads/2021/07/limenu4.jpg 250w" sizes="(max-width: 183px) 100vw, 183px" />
<p>すでに作ったメニューが並び、そのメニューがどの位置に配置することになっているのか出てきます。</p>
<p>上記の場合、Wordpressという名前を付けたメニューがヘッダー（Header Navigation）とフッター（Footer Navigation）に設置されるようになっています。</p>
<h3>メニューの変更</h3>
<p>例えば、コーポレートサイトをフッターメニューにするならば、右側の矢印をクリックし展開して変更します。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15744 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu5.jpg" alt="" width="400" height="289" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu5.jpg 400w, https://blognote01.com/wp-content/uploads/2021/07/limenu5-300x217.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" />
<p>メニューの位置のタイトル部分のFooter Navigationの部分にチェックを入れ、上部の「公開」をクリックします。</p>
<p>すると、現在の設定として「コーポレートサイト」が出てきます。</p>
<p>&nbsp;</p>
<h2>Lightningのメニュー補足（よく似た機能）　「PRブロック」</h2>
<p>これはメニューではありませんが、ユーザーをURLに導くという意味で混同しそうなので、一応コチラでも説明しておきます。</p>
<p>Lightningでヘッダーと共に目立つ部分「PRブロック」ですが、アイコンを変更したり色を変更したりと使い勝手の良いものですので是非活用してみてください。</p>
<ol>
<li>PRブロックを表示・非表示</li>
<li>アイコンの変更</li>
<li>URL等の設定</li>
<li>色の変更</li>
</ol>
<p>&nbsp;</p>
<h3>1.　PRブロックを表示・非表示</h3>
<p>まず、この3つのPRブロックを表示するかどうかを設定します。この部分を入れるとビジネスっぽくなるので非表示でもいいと思います。</p>
<p>ただ、工夫をして特定の記事やアフィリエイトにも使ってみると面白いかもしれません。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　LightningトップページPR Block </span></p>
<ul>
<li>非表示・・・「PR Block を表示する」のチェックを外す。</li>
<li>表示・・・「PR Block を表示する」のチェックを入れる。</li>
</ul>
<p>&nbsp;</p>
<h3>2.　アイコンの変更</h3>
<p>3つのボックスの中にあるアイコンを好きなものに変更できるようになっています。IDコードをコピペして設定しましょう。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15747" src="https://blognote01.com/wp-content/uploads/2021/07/limenu6-212x300.jpg" alt="" width="212" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu6-212x300.jpg 212w, https://blognote01.com/wp-content/uploads/2021/07/limenu6.jpg 250w" sizes="(max-width: 212px) 100vw, 212px" />
<p>アイコンにはコードが入っています。変更するにはicon listをクリックすると展開します。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15748 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu7.jpg" alt="" width="450" height="262" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu7.jpg 450w, https://blognote01.com/wp-content/uploads/2021/07/limenu7-300x175.jpg 300w" sizes="(max-width: 450px) 100vw, 450px" />
<p>この中から好きなアイコンを選びコードをコピペして先ほどの枠に入力すると変更されます。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<p>&nbsp;</p>
<h3>3.　URL等の設定</h3>
<p>PRボックスのその他の設定をしていきます。タイトルやURLを入力します。</p>
<ul>
<li>タイトル</li>
<li>サブタイトル</li>
<li>リンクURL</li>
</ul>
<p>上記3点だけ設定すればOKです。</p>
<p>3つPRボックスを設置できますので、PRボックス1～3までを設定します。</p>
<p>&nbsp;</p>
<h3>4.　色の変更</h3>
<p>PRボックスは色の変更ができます。下の画像を見ていただくとヘッダー画像とPRボックスの色を合わせているのがわかると思います。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15750 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/limenu8.jpg" alt="" width="500" height="251" srcset="https://blognote01.com/wp-content/uploads/2021/07/limenu8.jpg 500w, https://blognote01.com/wp-content/uploads/2021/07/limenu8-300x151.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/limenu8-485x243.jpg 485w" sizes="(max-width: 500px) 100vw, 500px" />
<p>こんな感じで色合わせをすると全体にまとまった感じが出てきますので設定の最後に色のチェックもしてみてください。</p>
<p>（ヘッダー画像で一番多く使われている色にしたり、画像で目だつ色にするとよいです）</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　Lightningデザイン設定</span></p>
<p>色設定のタイトル部分のキーカラーを変更します。</p>
<p>&nbsp;</p>
<h2>Lightning（Wordpressテーマ）のメニューカスタマイズ　まとめ</h2>
<p>Lightningは、設定する項目が少ないのでカスタマイザーにしろメニューにしろ超シンプルに使うことができます。</p>
<p>メニューについても最初に作っておけば、ブログを見ながらどこに設置するのかバランス等調整してみてください。</p>
<h3>Lightningのメニュー設定できる場所</h3>
<p>メニュー自体は複数作ることができます。設置できる位置はPCならヘッダーの上部、フッター。スマホ画面なら1か所です。</p>
<ul>
<li>Header Navigation（ヘッダーのメニュー）</li>
<li>Footer Navigation（フッターのメニュー）</li>
<li>Mobile Navigation（スマホのメニュー）</li>
</ul>
<p>&nbsp;</p>
<h3>Lightningのメニュー設定順序</h3>
<p>どのWordpressメニューもほぼ同じやり方ですので、覚えておくと便利ですし、新しいテンプレートになっても焦りません。</p>
<ul>
<li>メニューを作る（タイトルと項目を設定）</li>
<li>メニューを好きな位置に配置する</li>
</ul>
<p>&nbsp;</p>
<h3>Lightningのメニューっぽい機能　PRボックス</h3>
<p>PRボックスは見た目に可愛いので、ブログでも使えます。表示・非表示等も可能ですので、調整しましょう！</p>
<p>&nbsp;</p>
<p><strong>↓　当ブログからWordpressテーマTHE THORを購入くださった方に特典をプレゼントしています。</strong><br />
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></p>

<h2>初心者だからこそWordpress有料テーマ を使うべき理由</h2>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><br />
<span style="font-size: 12pt;"><strong>無料テーマを使うことで時間の無駄遣いをしていませんか？</strong></span></p>
<ul>
<li>思い通りのデザインにできない・・・</li>
<li>なかなか稼げない・・・</li>
<li>アクセス数が増えない・・・</li>
</ul>
<p>こんな悩みを抱えていませんか？<br />
&nbsp;</p>
<p>稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。</p>
<p>&nbsp;</p>
<h3>Wordpressの有料テーマができる５つのこと</h3>
<ol>
<li>検索上位を目指せる</li>
<li>見た目が綺麗でおしゃれになる</li>
<li>機能が豊富で出来ることが多い</li>
<li>会員フォームなどのサポート</li>
<li>有名ブロガーも有料テーマを使っている</li>
</ol>
<p>&nbsp;</p>
<p>これまでにあげた5つの有料テーマの特徴を説明していきます。</p>
<h4>1.　検索上位を目指せる</h4>
<p>ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。</p>
<ul>
<li>情報の信頼性</li>
<li>ユーザーへの役立つ情報であるか？</li>
<li>スマホ・PCなどでストレスなく使える</li>
</ul>
<p>&nbsp;</p>
<p>などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。</p>
<p>&nbsp;</p>
<h4>2.　見た目が無料テーマ以上に綺麗になる</h4>
<p>シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。</p>
<p>有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。</p>
<p style="text-align: center;"><img loading="lazy" decoding="async" class="size-medium wp-image-9942 aligncenter" src="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg" alt="" width="300" height="218" srcset="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg 300w, https://blognote01.com/wp-content/uploads/2020/05/THOR222.jpg 650w" sizes="(max-width: 300px) 100vw, 300px" />出典：THE THOR 着せ替え「01」</p>
<p style="text-align: center;"><strong>↓　クリックで拡大します</strong><br />
<a href="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-11133 size-medium" src="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg" alt="" width="300" height="169" srcset="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1024x576.jpg 1024w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1536x864.jpg 1536w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-2048x1152.jpg 2048w" sizes="(max-width: 300px) 100vw, 300px" /></a>出典：<a href="https://blognote01.com/thethor-newarrange" target="_blank" rel="noopener noreferrer">特製THE THORオリジナルアレンジ</a></p>
<p>&nbsp;</p>
<h4>3.　機能が豊富でできることが多い</h4>
<p>今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。</p>
<h4>4.　会員フォーラムなどのサポート</h4>
<p>なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。</p>
<h4>5.　有名ブロガーも多数使用</h4>
<p>稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。</p>
<p>もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。</p>
<p>カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。</p>
<p><div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">当ブログおすすめWordpressテーマ！</span></div><div class="cboxcomment"><br />
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2019/05/nigaoemaker-e1558864804973.png" alt="" width="96" height="96" class="alignnone  wp-image-1393" /><br />
<span style="font-size: 14pt;"><strong><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">WordPressテーマ「THE・THOR」</a></strong></span></p>
<ul>
<li>高機能の最新テーマで有名ブロガーも使用</li>
<li>着せ替え機能でいろんな用途に使える</li>
<li>複数のブログに使える（本人のブログ）</li>
<li>会員フォーラムやマニュアル完備</li>
</ul>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://blognote01.com/thethor-tokuten" target="_blank" rel="noopener"class="wp-block-button__link" >THE THORの8大特典を見てみる！</a></div><br />
</div></div>
<br />
</div></div>

]]></content:encoded>
					
					<wfw:commentRss>https://blognote01.com/lightning-menu/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">15736</post-id>	</item>
		<item>
		<title>Lightningのデモデザインの事例！デザイン作成と設定！【WordPressテーマ】</title>
		<link>https://blognote01.com/lightning-demo</link>
					<comments>https://blognote01.com/lightning-demo#respond</comments>
		
		<dc:creator><![CDATA[なつ]]></dc:creator>
		<pubDate>Mon, 05 Jul 2021 07:22:04 +0000</pubDate>
				<category><![CDATA[Lightning]]></category>
		<category><![CDATA[無料Wordpressテーマ【評判・感想】]]></category>
		<guid isPermaLink="false">https://blognote01.com/?p=15629</guid>

					<description><![CDATA[ブログ運営半年で月20万超の元サラリーマンブロガーなつです。 LightningというWordpressテーマはご存知でしょうか。Wordpressの公式ディレクトリにも登録されているとてもシンプルなテンプレートです。 ...]]></description>
										<content:encoded><![CDATA[<p>ブログ運営半年で月20万超の元サラリーマンブロガーなつです。</p>
<p>LightningというWordpressテーマはご存知でしょうか。Wordpressの公式ディレクトリにも登録されているとてもシンプルなテンプレートです。</p>
<p>超シンプルと聞くと「Twenty Twenty」とか「Twenty Twenty-One」という公式テンプレートを思い出しますが、Lightningではデザインが優れていて、必要なものはそろっているイメージです。</p>
<p>&nbsp;</p>
<p><strong>Lightning（Wordpressテーマ）の基本のデモ画面デザインの作り方をお伝えします。</strong></p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>　<span style="font-size: 14pt;"><strong>2023年、話題のワードプレステーマ「THE THOR」</strong></span><br />
<strong>⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE・THORの公式ページを確認する。</a></strong></p>
<p>※　今なら、8大購入特典をプレゼント！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-hyouban"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2019/07/thorkutikomi-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの評判】実際使ってみた口コミとレビュー。</div></div></a></div></div></div>

<h2>Lightningの基本のデモ画面　　（Wordpressテーマ）</h2>
<p>Lightning（Wordpressテーマ）では、 「VK All in One Expansion Unit 」と 「VK Blocks」というプラグインがあります。</p>
<p>これらのプラグインはLightningを導入してから拡張機能として追加するものですが、実際はなくても使うことが可能です。</p>
<p>Lightningの基礎の機能だけでもそこそこ使えるので今回は、拡張機能のプラグインは導入せずにデザインを作ってきます。</p>
<p>&nbsp;</p>
<h3>基本のデザイン</h3>
<p>Lightningに必要な部分を設定すれば以下のようなサンプルデザインとなります。これは公式のデザインでビジネス用に作られたものです。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓クリックで拡大します。<a href="https://blognote01.com/wp-content/uploads/2021/07/lightdemo.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-15631 size-medium" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo-151x300.jpg" alt="" width="151" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo-151x300.jpg 151w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo.jpg 400w" sizes="(max-width: 151px) 100vw, 151px" /></a>出典：<a href="https://lightning.nagoya/ja/" target="_blank" rel="nofollow noopener">Lighting公式ページ</a></p>
<p>&nbsp;</p>
<p>上記画像はビジネス用に作られたトップページですが、必要なものはキチンと配置されているのにゴチャゴチャした感じがありません。</p>
<p>カラーも統一されているので清潔感があります。</p>
<p>この先は、各パーツごとに説明をしていきます。</p>
<p>&nbsp;</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/lightning-design"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain742-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>WordPressデザイン無料テーマ「Lightning」でどんなことができる？</div><time class="time__date gf undo">2022.02.11</time></div></a></div>
<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　1.「タイトル」</h2>
<p>トップページの上部に必ずタイトルが配置されます。ここには、テキストだけではなくロゴも設定できます。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15633 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo2.jpg" alt="" width="497" height="191" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo2.jpg 497w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo2-300x115.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo2-485x186.jpg 485w" sizes="(max-width: 497px) 100vw, 497px" />
<p>&nbsp;</p>
<p>まずは、Wordpressテーマを導入したら必ず設定するタイトルとキャッチフレーズの入力をみていきましょう。</p>
<p>&nbsp;</p>
<ol>
<li>タイトル</li>
<li>キャッチフレーズ</li>
<li>サイトアイコン</li>
</ol>
<p>&nbsp;</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　サイト基本情報</span></p>
<img loading="lazy" decoding="async" class="alignnone size-full wp-image-15637" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo5.jpg" alt="" width="200" height="301" />
<h3>1.　タイトル</h3>
<p>ブログを作っていく上でタイトルは重要です。そのブログのジャンルがわかるように工夫しましょう。</p>
<p>「サイトのタイトル」の部分にテキストを入力します。</p>
<p>&nbsp;</p>
<h3>2.　キャッチフレーズ</h3>
<p>キャッチフレーズでは、そのブログの説明を簡潔に文章にして入力します。一緒に設定するのが理想ですが、トップページには表示されませんので、後で設定でも大丈夫です。</p>
<p>&nbsp;</p>
<h3>3.　サイトアイコン</h3>
<p>サイトアイコンは、ウェブサイトを開いた時に上部のタブのタイトルの左横に出てくる小さなアイコンのことです。</p>
<div class="supplement "><strong>補足</strong></p>
<p>推奨の画像サイズ：512×512px以上の正方形サイズ</p>
</div>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>  <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」！</strong></span><br />
⇒<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する</a><br />
※今なら、8大購入特典をお付けしています！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　1-2.「ロゴ」</h2>
<p>トップページの上部にはタイトルがくるのですが、例えば決まったロゴがある場合や自分でタイトル入りのロゴが作れるならここに設置しましょう。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15638 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo7.jpg" alt="" width="400" height="180" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo7.jpg 400w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo7-300x135.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" />
<p>&nbsp;</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　Lightningデザイン設定</span></p>
<p>「ヘッダーロゴ画像」の部分に画像を追加します。</p>
<p>&nbsp;</p>
<div class="supplement "><strong>補足</strong></p>
<p>画像の推奨サイズは　: 280×60pxとなっています。</p>
</div>
<p>上記の画像は、ロゴとして作った画像です。ロゴはCANVAというサイトで作れますので、以下の記事を参考にしてみてください。</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/blog-headersakusei"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2020/02/Wordpress-アドセンス広告の貼り方！-1-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>ブログのヘッダー画像は「CANVA」でおしゃれに作成！目立つトップページのツールでの作り方。</div><time class="time__date gf undo">2023.02.12</time></div></a></div>
<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　2.「メニュー（上部）」</h2>
<p>記事数が増えてきたらカテゴリーごとにメニューを作ったり、もしお店などのサイトならアクセス方法や連絡先など工夫して配置していきましょう。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15633" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo2-300x115.jpg" alt="" width="300" height="115" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo2-300x115.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo2-485x186.jpg 485w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo2.jpg 497w" sizes="(max-width: 300px) 100vw, 300px" />
<p>&nbsp;</p>
<h3>メニューの作り方</h3>
<p>メニューの作り方はどのWordpressテーマも同じです。順序としては、メニューを作成しておきカスタマイズで配置します。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　メニュー</span></p>
<p>メニューの名前を入力し、左のメニュー項目を右のメニュー構造に配置しておきます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-13325 size-full" src="https://blognote01.com/wp-content/uploads/2021/01/amenu.jpg" alt="" width="500" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/01/amenu.jpg 500w, https://blognote01.com/wp-content/uploads/2021/01/amenu-300x180.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<h3>メニューを配置</h3>
<p>メニュー設定の部分では、どこに配置をするのか指定します。メニューの位置で「Header Navigation」にチェックを入れ、メニューを保存をクリックします。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　3.「ヘッダー画像」</h2>
<p>トップページの目立つ部分に画像を配置します。このデモサイトではスライドショーにしていますのでそのやり方をここで説明していきます。</p>
<p>スライダーを表示させたくない場合には「非表示」も選べます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15641 size-full" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo9.jpg" alt="" width="400" height="195" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo9.jpg 400w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo9-300x146.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" />
<p>カスタマイズでは以下のようなことができます。</p>
<p>&nbsp;</p>
<ul>
<li>スライド効果</li>
<li>スライド切り替え間隔</li>
<li>スライドタイトル</li>
<li>スライドテキスト</li>
<li>ボタンのテキスト</li>
<li>リンクURL</li>
<li>位置</li>
<li>スライド上の文字</li>
<li>文字の影</li>
</ul>
<p>&nbsp;</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　<span style="background-color: #ffc6d1;">Lightningトップページ</span></span></p>
<p>スライド画像ごとに設定ができますので、ボタンは必要なもの不要なものや効果の変更など個別に設定していきましょう。</p>
<h3>スライドの設定</h3>
<p>スライドの効果や間隔などを設定します。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15642" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo10-300x135.jpg" alt="" width="300" height="135" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo10-300x135.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo10-485x218.jpg 485w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo10.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" />
<ul>
<li>スライド効果</li>
<li>スライドの間隔</li>
<li>タイトル（テキスト）</li>
<li>スライドテキスト</li>
</ul>
<p>&nbsp;</p>
<p>尚、スライドテキストとボタンは任意ですので、必要ない場合には特に設定する必要はありません。</p>
<p>&nbsp;</p>
<h3>ボタンの設定</h3>
<p>画像ごとにボタン設置ができます。URLでの誘導などしたい場合にはここで設定しておきましょう。こちらも色設定や影の設定などできますので必要に応じて設定してみてください。</p>
<h3>スライド画像の設定</h3>
<p>画像の設定も同じ場所で行います。スライド画像についてはフリーのイラストでも写真画像でもきれいに映えます。</p>
<p>大きさについては<strong><span style="color: #fc6262;">推奨サイズは1900×600px</span></strong>です。</p>
<p>&nbsp;</p>
<h3>スライド画像にのせる色</h3>
<p>この設定が面白いのですが、画像の上に色をかさねることができます。さらに、色の濃さの％も調整できますので、イメージにあった色を設定します。</p>
<p>&nbsp;</p>
<p>このカスタマイズでは、5枚のスライドまで可能ですので、好きな画像とタイトルなどを設定していきます。</p>
<p>フリー画像をどこでダウンロードするのか迷ったら以下の記事が役に立ちます。</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/blogillust-free"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2020/01/ブログで使える-無料イラスト-1-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>ブログで使えるイラスト25選！フリー（無料）素材でサイトをパワーアップ！</div><time class="time__date gf undo">2022.08.08</time></div></a></div>
<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　4.「PRブロック」</h2>
<p>Lightningで一番目立つのは3つのPRブロックではないでしょうか。アイコンも自分好みに変更できますので、使い勝手が良いです。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15634" src="https://blognote01.com/wp-content/uploads/2021/07/lightdemo3-300x144.jpg" alt="" width="300" height="144" srcset="https://blognote01.com/wp-content/uploads/2021/07/lightdemo3-300x144.jpg 300w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo3-485x233.jpg 485w, https://blognote01.com/wp-content/uploads/2021/07/lightdemo3.jpg 499w" sizes="(max-width: 300px) 100vw, 300px" />
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　<span style="background-color: #ffc6d1;">Lightning トップページ PR Bloc</span></span><span style="background-color: #ffc6d1;">k</span></p>
<p>「PR Block を表示する」にチェックを入れます。</p>
<ul>
<li>アイコン</li>
<li>タイトル</li>
<li>サブテキスト</li>
<li>リンクURL</li>
</ul>
<p>&nbsp;</p>
<p>上記の項目の設定をします。アイコンは、リストのリンクがありますのでクリックをするとたくさんの種類が出てきます。コードをコピペして貼り付けましょう。</p>
<p>全部で3つ設定します。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<h2>Lightningのデモサイト設定　5.「キーカラー」</h2>
<p>投稿ページやトップページのPRブロックなど基本となる色を設定しておきます。デフォルトで良い場合は触らないでOKですが、ブログのイメージがあるなら設定しておきましょう。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　Lightningデザイン設定</span></p>
<p>下にスクロールしていくと「色設定」の場所がでてきます。</p>
<p>この部分でキーカラーがでてきますので好きな色を設定します。</p>
<p>&nbsp;</p>
<h2>Lightningのデモサイト設定　6.「投稿記事」</h2>
<p>サイドバーの投稿記事の設置です。新しい記事を配置してもよいですし人気記事でも配置する場合にはウィジェットで設定します。</p>
<p>人気記事はプラグインの「WordPress Popular Posts」を導入しておきましょう。</p>
<p>&nbsp;</p>
<h3>トップページを2カラムに変更</h3>
<p>トップページで人気記事などを配置したい場合には、1カラムを2カラムに変更しサイドバーを表示させてから配置します。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　Lightning レイアウト設定</span></p>
<p>カラム設定のトップページを2カラムにします。</p>
<h3>人気記事を配置</h3>
<p>ウィジェットの右の「バー（トップページ）」に左「項目」内の「WordPress Popular Posts」を移動させます。</p>
<p>&nbsp;</p>
<h2>初心者だからこそWordpress有料テーマ を使うべき理由</h2>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><br />
<span style="font-size: 12pt;"><strong>無料テーマを使うことで時間の無駄遣いをしていませんか？</strong></span></p>
<ul>
<li>思い通りのデザインにできない・・・</li>
<li>なかなか稼げない・・・</li>
<li>アクセス数が増えない・・・</li>
</ul>
<p>こんな悩みを抱えていませんか？<br />
&nbsp;</p>
<p>稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。</p>
<p>&nbsp;</p>
<h3>Wordpressの有料テーマができる５つのこと</h3>
<ol>
<li>検索上位を目指せる</li>
<li>見た目が綺麗でおしゃれになる</li>
<li>機能が豊富で出来ることが多い</li>
<li>会員フォームなどのサポート</li>
<li>有名ブロガーも有料テーマを使っている</li>
</ol>
<p>&nbsp;</p>
<p>これまでにあげた5つの有料テーマの特徴を説明していきます。</p>
<h4>1.　検索上位を目指せる</h4>
<p>ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。</p>
<ul>
<li>情報の信頼性</li>
<li>ユーザーへの役立つ情報であるか？</li>
<li>スマホ・PCなどでストレスなく使える</li>
</ul>
<p>&nbsp;</p>
<p>などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。</p>
<p>&nbsp;</p>
<h4>2.　見た目が無料テーマ以上に綺麗になる</h4>
<p>シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。</p>
<p>有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。</p>
<p style="text-align: center;"><img loading="lazy" decoding="async" class="size-medium wp-image-9942 aligncenter" src="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg" alt="" width="300" height="218" srcset="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg 300w, https://blognote01.com/wp-content/uploads/2020/05/THOR222.jpg 650w" sizes="(max-width: 300px) 100vw, 300px" />出典：THE THOR 着せ替え「01」</p>
<p style="text-align: center;"><strong>↓　クリックで拡大します</strong><br />
<a href="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-11133 size-medium" src="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg" alt="" width="300" height="169" srcset="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1024x576.jpg 1024w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1536x864.jpg 1536w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-2048x1152.jpg 2048w" sizes="(max-width: 300px) 100vw, 300px" /></a>出典：<a href="https://blognote01.com/thethor-newarrange" target="_blank" rel="noopener noreferrer">特製THE THORオリジナルアレンジ</a></p>
<p>&nbsp;</p>
<h4>3.　機能が豊富でできることが多い</h4>
<p>今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。</p>
<h4>4.　会員フォーラムなどのサポート</h4>
<p>なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。</p>
<h4>5.　有名ブロガーも多数使用</h4>
<p>稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。</p>
<p>もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。</p>
<p>カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。</p>
<p><div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">当ブログおすすめWordpressテーマ！</span></div><div class="cboxcomment"><br />
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2019/05/nigaoemaker-e1558864804973.png" alt="" width="96" height="96" class="alignnone  wp-image-1393" /><br />
<span style="font-size: 14pt;"><strong><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">WordPressテーマ「THE・THOR」</a></strong></span></p>
<ul>
<li>高機能の最新テーマで有名ブロガーも使用</li>
<li>着せ替え機能でいろんな用途に使える</li>
<li>複数のブログに使える（本人のブログ）</li>
<li>会員フォーラムやマニュアル完備</li>
</ul>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://blognote01.com/thethor-tokuten" target="_blank" rel="noopener"class="wp-block-button__link" >THE THORの8大特典を見てみる！</a></div><br />
</div></div>
<br />
</div></div>

]]></content:encoded>
					
					<wfw:commentRss>https://blognote01.com/lightning-demo/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">15629</post-id>	</item>
		<item>
		<title>WordPressデザイン無料テーマ「Lightning」でどんなことができる？</title>
		<link>https://blognote01.com/lightning-design</link>
					<comments>https://blognote01.com/lightning-design#respond</comments>
		
		<dc:creator><![CDATA[なつ]]></dc:creator>
		<pubDate>Fri, 21 May 2021 09:11:40 +0000</pubDate>
				<category><![CDATA[Lightning]]></category>
		<category><![CDATA[Wordpress（ワードプレス）]]></category>
		<category><![CDATA[無料Wordpressテーマ【評判・感想】]]></category>
		<guid isPermaLink="false">https://blognote01.com/?p=15073</guid>

					<description><![CDATA[ブログ運営半年で月20万超の元サラリーマンブロガーなつです。 無料テーマはたくさんありますが、超シンプルでビジネスにも使えそうなテンプレートといえばまっさきに「Lightning」が思い浮かびます。 有料テーマと比べれば...]]></description>
										<content:encoded><![CDATA[<p>ブログ運営半年で月20万超の元サラリーマンブロガーなつです。</p>
<p>無料テーマはたくさんありますが、超シンプルでビジネスにも使えそうなテンプレートといえばまっさきに「Lightning」が思い浮かびます。</p>
<p>有料テーマと比べれば若干見劣りはするものの、スッキリしたデザインは余計なものをそぎ落としたシンプルなものです。</p>
<p><strong>無料テーマ「Lightning」を使ったWordPressデザインをお伝えしていきます。</strong></p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>　<span style="font-size: 14pt;"><strong>2023年、話題のワードプレステーマ「THE THOR」</strong></span><br />
<strong>⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE・THORの公式ページを確認する。</a></strong></p>
<p>※　今なら、8大購入特典をプレゼント！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-hyouban"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2019/07/thorkutikomi-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの評判】実際使ってみた口コミとレビュー。</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>WordPressデザイン無料テーマ「Lightning」とは</h2>
<p>「Lightning」とは、Wordpressのディレクトリにも出てくるシンプルなテンプレートです。このディレクトリに名前を出してもらうには結構厳しい審査があるらしいのでそれをクリアした優秀なテーマだということがわかります。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="aligncenter wp-image-15075 size-full" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain.jpg" alt="" width="500" height="299" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain.jpg 500w, https://blognote01.com/wp-content/uploads/2021/05/lidezain-300x179.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p>&nbsp;</p>
<p>ダウンロードして出来上がるデザインは超シンプルですが、それをうまく利用するとクールなカッコいいイメージとなります。</p>
<p>このテーマは、拡張機能が使えるプラグインがありますが、それらを使わない超シンプルにトップページを作れる方法をお伝えしていきます。</p>
<p>&nbsp;</p>
<h2>WordPress無料テーマ「Lightning」デザイン完成図</h2>
<p>これからどんなデザインを作っていくのか見ていきます。Lightningは最初のレイアウトがシンプルだけどカッコいい配置になっていますので大きくは2つの箇所だけ変更するとそこそこ見えるようになります。</p>
<p style="text-align: center;"> ↓　クリックすると拡大します<br />
<a href="https://blognote01.com/wp-content/uploads/2021/05/lidezain17.jpg"><img loading="lazy" decoding="async" class="alignnone wp-image-15090 size-medium" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain17-283x300.jpg" alt="" width="283" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain17-283x300.jpg 283w, https://blognote01.com/wp-content/uploads/2021/05/lidezain17.jpg 500w" sizes="(max-width: 283px) 100vw, 283px" /></a></p>
<p>&nbsp;</p>
<p>このトップページでは、ヘッダー画像設置、PR Block、キーカラー変更でだいたい出来上がっています。</p>
<p>3工程でほぼ出来上がりますし、ご覧いただいているようになかなかカッコいいデザインになるので使いやすいですね。</p>
<p>&nbsp;</p>
<p>↓　Wordpressテーマ「THE THOR」公式デザインに芸大卒なつのデザイン10種類追加！</p>
<div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">THE THORデザインのマニュアルプレゼント中！</span></div><div class="cboxcomment"><strong>人気のTHE THORのオリジナルテンプレート6種類+5種類（NEW）ができました！</strong></p>
<p>当ブログで購入していただくと、公式の9種類のデザインと追加の10種類が無料で手に入ります！</p>
<p><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="aligncenter wp-image-18090 size-full" src="https://blognote01.com/wp-content/uploads/2021/10/9shu.jpg" alt="THE THOR特典オリジナルアレンジマニュアルバナー" width="500" height="281" srcset="https://blognote01.com/wp-content/uploads/2021/10/9shu.jpg 500w, https://blognote01.com/wp-content/uploads/2021/10/9shu-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2021/10/9shu-375x211.jpg 375w" sizes="(max-width: 500px) 100vw, 500px" /></a></p>
<p>※デザインの全体像は以下の2記事をご覧ください。</p>
<p><strong>⇒<a href="https://blognote01.com/thethor-design6" target="_blank" rel="noopener noreferrer">【超簡単】THE THORデザインの事例集6選！初心者でも作れるアレンジ！</a><br />
</strong>⇒<strong><a href="https://blognote01.com/thethor-originaltokuten" target="_blank" rel="noopener noreferrer">追加デザイン4種はコチラから</a></strong>見ることができます。</p>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored"class="wp-block-button__link" >特典付きでTHE THORを購入する</a></div></p>
<p style="text-align: center;">／／たった30記事で稼いだ実録記事（2,980円相当）付き!＼＼</p>
<p>※ヘッダーの画像は、写真ACとイラストACのイラストレーターさん方の作品です。特典内でURLをお伝えしています。</p>
<p></div></div>

<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　準備　「画像ダウンロード」</h2>
<p>まず、「Lightning」はヘッダー部分の画像をスライダーにすることもできますし、その画像にタイトルや誘導ボタンを配置することもできます。</p>
<p>さらに、視覚的にも画像に色を重ねることも可能。</p>
<p>そもそも基本形がかなりシンプルなのでヘッダー画像は上手にダウンロードして、推奨サイズに加工をしましょう。</p>
<p>&nbsp;<br />
<div class="cbox is-style-glay_box type_normal"><div class="cboxcomment">
<ul>
<li>ヘッダー画像推奨サイズ：　1900×600px</li>
</ul>
</div></div>
&nbsp;</p>
<p>画像をダウンロードするサイトを見つけたら、加工がOKなのか必ず確認してください。フリー画像のサイトは以下の記事でご確認ください。</p>
<p>&nbsp;</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/blogillust-free"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2020/01/ブログで使える-無料イラスト-1-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>ブログで使えるイラスト25選！フリー（無料）素材でサイトをパワーアップ！</div></div></a></div>
<p>&nbsp;</p>
<h3>写真ACでのダウンロードのやり方</h3>
<p>このサイトもそうなんですが、使用させてもらってるのは写真ACというフリー画像サイトです。いろんな人がデザインしていたり画像を提供しているので自分の好みの画像が見つかります。</p>
<p>メルアドと名まえ等簡単な登録で使えるようになります。</p>
<p>&nbsp;</p>
<p>⇒　<a href="https://www.photo-ac.com/" target="_blank" rel="noopener">写真AC</a><br />
⇒　<a href="https://www.ac-illust.com/" target="_blank" rel="noopener">イラストAC</a></p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15043 size-full" src="https://blognote01.com/wp-content/uploads/2021/05/wd3.jpg" alt="" width="500" height="222" srcset="https://blognote01.com/wp-content/uploads/2021/05/wd3.jpg 500w, https://blognote01.com/wp-content/uploads/2021/05/wd3-300x133.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p>たとえば、コーヒーカップの画像が欲しいなら検索窓に「コーヒー」などと入れてみると関連画像が出てきます。</p>
<p>ただし、無料で登録すると検索回数やダウンロード回数に制限がかかりますので、何度もやってしまうとそれ以上検索やダウンロードができなくなります。</p>
<p>&nbsp;<br />
<div class="supplement "><strong>補足</strong><br />
Lightningのヘッダー画像のサイズは自分が思うよりも横長なので、画像についても縦に高いものではなく、被写体が横に広がっているものを選びましょう。</p>
</div>
&nbsp;</p>
<p>普通のサイズの画像でも使えないことはないのですがPCやスマホの画面から外れて縦長のぼんやりした感じになります。</p>
<p>好きな画像が見つかったら、その画像をクリックするとダウンロードするためのボタンが出てきます。（たまにアンケートが出てきます）</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15078" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain2-300x248.jpg" alt="" width="300" height="248" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain2-300x248.jpg 300w, https://blognote01.com/wp-content/uploads/2021/05/lidezain2.jpg 400w" sizes="(max-width: 300px) 100vw, 300px" />
<p>&nbsp;</p>
<p>ログインしてからダウンロードボタンを押すと画像がパソコンに入ります。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>  <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」！</strong></span><br />
⇒<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する</a><br />
※今なら、8大購入特典をお付けしています！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　準備　「画像加工」</h2>
<p>さて、画像をダウンロードできたら次は加工します。大きさも縦横比も調整することになりますので、最初に加工してしまいます。</p>
<p>切り抜きにはいろんなやり方やツールがあると思いますが、ここでは一番シンプルで初歩的なやり方をしていきます。</p>
<h3>ペイントを使用</h3>
<p>パソコンを購入すればデフォルトで入っている可能性が高いのが「ペイント」というソフトです。簡単な大きさの調整やテキストを乗せたりできます。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15079" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain4-300x164.jpg" alt="" width="300" height="164" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain4-300x164.jpg 300w, https://blognote01.com/wp-content/uploads/2021/05/lidezain4.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" />
<p>ファイルを開いて画像を表示させます。今回の画像は縦横3000pxを超えているので、まずは横の長さを1900pxに揃えます。</p>
<p>上部の「サイズ変更」をクリックすると画像の大きさを調整するウインドウが出てきます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15081 size-medium" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain6-179x300.jpg" alt="" width="179" height="300" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain6-179x300.jpg 179w, https://blognote01.com/wp-content/uploads/2021/05/lidezain6.jpg 326w" sizes="(max-width: 179px) 100vw, 179px" />
<p>単位をピクセルにし水平方向（H）に1900を入れます。この作業で横の長さが1900pxになりました。次に、画像をスクロールして一番下まで行きます。</p>
<p>下の画像はちょっと小さいのですが、一番下までスクロールすると小さなボタンがでてきます。この部分をドラッグ＆ドロップして画像の縦部分を小さくします。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-15082" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain7-300x138.jpg" alt="" width="300" height="138" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain7-300x138.jpg 300w, https://blognote01.com/wp-content/uploads/2021/05/lidezain7.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" />
<p>反対側も小さくしたい場合、上記の「回転」をクリックし180度回転してまた同じ作業をします。</p>
<p>ペイントがない場合には、フリーソフトを検索で探してみてください。</p>
<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　1.　「ヘッダー画像」</h2>
<p>ここからは、前の章で作った画像をヘッダー部分に表示させていきます。作業自体はそれほど難しくありませんので、画像ができたらすぐに設定しておきましょう。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　Lightningトップぺージスライドショー</span></p>
<p>画像のみの設定もできますし、中にタイトルやメッセージを入れることも可能です。</p>
<ul>
<li>スライドタイトル</li>
<li>スライドテキスト</li>
<li>ボタンのテキスト</li>
<li>リンクURL</li>
</ul>
<p>&nbsp;</p>
<p>上記を設定すると以下のようなヘッダー画像が出来上がります。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15084 size-full" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain10.jpg" alt="" width="500" height="207" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain10.jpg 500w, https://blognote01.com/wp-content/uploads/2021/05/lidezain10-300x124.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p>色などはカラーパレットがありますので、同じ部分で設定をしていきます。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　2.　「複数画像でスライダーにする」</h2>
<p>前の章で設定をしたのはトップページをスライドショーする操作ですが、Lightningでは5枚までスライドさせることができます。</p>
<p>スライドショーにするのはとても簡単で、以下の部分に文章やURLをそれぞれ入力していきます。</p>
<img loading="lazy" decoding="async" class="alignnone size-full wp-image-15085" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain11.jpg" alt="" width="200" height="247" />
<p>画像さえうまく推奨サイズにできるようになればバランスよくなりますので、最初の画像切り取りだけでもここまできれいになります。</p>
<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　3.「PR Block」</h2>
<p>Lightningの特徴のひとつにPR Blockがあります。それはヘッダー画像に配置する誘導ボタンと同じものです。</p>
<p>例えば、お店の宣伝ならお店のサイトのURLとか、お知らせしたいものをここに配置できます。アイコン等も引き込んで使えるので使いやすいです。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-15088 size-full" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain15.jpg" alt="" width="500" height="228" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain15.jpg 500w, https://blognote01.com/wp-content/uploads/2021/05/lidezain15-300x137.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　LightningトップページPR Block</span></p>
<p>「PR Block を表示する」にチェックを入れます。</p>
<p>&nbsp;</p>
<ul>
<li>アイコン</li>
<li>タイトル</li>
<li>サブテキスト</li>
</ul>
<p>上記を入力します。3つまで配置できますので、それぞれ枠を埋めていきます。</p>
<p>&nbsp;</p>
<h2>WordPress無料テーマでデザインを作る工程　4.「デザイン設定」</h2>
<p>Lightningデザイン設定では、PRブロックの色やロゴの設置などができるようになっています。ヘッダー部分にロゴを入れたい方はここで調整してみてください。</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　カスタマイズ　⇒　Lightningデザイン設定</span></p>
<p>&nbsp;</p>
<ul>
<li>ヘッダーロゴ画像（280×60px推奨）設置</li>
<li>キーカラー設定・・・#dd5454</li>
</ul>
<p>タイトルをヘッダーに残したい場合にはロゴは入れないでください。</p>
<p>&nbsp;</p>
<p><strong>↓　当ブログからWordpressテーマTHE THORを購入くださった方に特典をプレゼントしています。</strong><br />
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></p>

<h2>初心者だからこそWordpress有料テーマ を使うべき理由</h2>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><br />
<span style="font-size: 12pt;"><strong>無料テーマを使うことで時間の無駄遣いをしていませんか？</strong></span></p>
<ul>
<li>思い通りのデザインにできない・・・</li>
<li>なかなか稼げない・・・</li>
<li>アクセス数が増えない・・・</li>
</ul>
<p>こんな悩みを抱えていませんか？<br />
&nbsp;</p>
<p>稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。</p>
<p>&nbsp;</p>
<h3>Wordpressの有料テーマができる５つのこと</h3>
<ol>
<li>検索上位を目指せる</li>
<li>見た目が綺麗でおしゃれになる</li>
<li>機能が豊富で出来ることが多い</li>
<li>会員フォームなどのサポート</li>
<li>有名ブロガーも有料テーマを使っている</li>
</ol>
<p>&nbsp;</p>
<p>これまでにあげた5つの有料テーマの特徴を説明していきます。</p>
<h4>1.　検索上位を目指せる</h4>
<p>ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。</p>
<ul>
<li>情報の信頼性</li>
<li>ユーザーへの役立つ情報であるか？</li>
<li>スマホ・PCなどでストレスなく使える</li>
</ul>
<p>&nbsp;</p>
<p>などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。</p>
<p>&nbsp;</p>
<h4>2.　見た目が無料テーマ以上に綺麗になる</h4>
<p>シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。</p>
<p>有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。</p>
<p style="text-align: center;"><img loading="lazy" decoding="async" class="size-medium wp-image-9942 aligncenter" src="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg" alt="" width="300" height="218" srcset="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg 300w, https://blognote01.com/wp-content/uploads/2020/05/THOR222.jpg 650w" sizes="(max-width: 300px) 100vw, 300px" />出典：THE THOR 着せ替え「01」</p>
<p style="text-align: center;"><strong>↓　クリックで拡大します</strong><br />
<a href="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-11133 size-medium" src="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg" alt="" width="300" height="169" srcset="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1024x576.jpg 1024w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1536x864.jpg 1536w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-2048x1152.jpg 2048w" sizes="(max-width: 300px) 100vw, 300px" /></a>出典：<a href="https://blognote01.com/thethor-newarrange" target="_blank" rel="noopener noreferrer">特製THE THORオリジナルアレンジ</a></p>
<p>&nbsp;</p>
<h4>3.　機能が豊富でできることが多い</h4>
<p>今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。</p>
<h4>4.　会員フォーラムなどのサポート</h4>
<p>なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。</p>
<h4>5.　有名ブロガーも多数使用</h4>
<p>稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。</p>
<p>もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。</p>
<p>カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。</p>
<p><div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">当ブログおすすめWordpressテーマ！</span></div><div class="cboxcomment"><br />
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2019/05/nigaoemaker-e1558864804973.png" alt="" width="96" height="96" class="alignnone  wp-image-1393" /><br />
<span style="font-size: 14pt;"><strong><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">WordPressテーマ「THE・THOR」</a></strong></span></p>
<ul>
<li>高機能の最新テーマで有名ブロガーも使用</li>
<li>着せ替え機能でいろんな用途に使える</li>
<li>複数のブログに使える（本人のブログ）</li>
<li>会員フォーラムやマニュアル完備</li>
</ul>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://blognote01.com/thethor-tokuten" target="_blank" rel="noopener"class="wp-block-button__link" >THE THORの8大特典を見てみる！</a></div><br />
</div></div>
<br />
</div></div>

]]></content:encoded>
					
					<wfw:commentRss>https://blognote01.com/lightning-design/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">15073</post-id>	</item>
		<item>
		<title>WordPressテーマLightningを使ったサイト事例！ホームページにするとこうなる！</title>
		<link>https://blognote01.com/wordpresslightning-demo</link>
					<comments>https://blognote01.com/wordpresslightning-demo#respond</comments>
		
		<dc:creator><![CDATA[なつ]]></dc:creator>
		<pubDate>Sat, 04 Jan 2020 10:47:44 +0000</pubDate>
				<category><![CDATA[Lightning]]></category>
		<category><![CDATA[無料Wordpressテーマ【評判・感想】]]></category>
		<category><![CDATA[おすすめ！]]></category>
		<guid isPermaLink="false">https://blognote01.com/?p=6691</guid>

					<description><![CDATA[こんにちは！ブログ運営半年で月20万超の元サラリーマンブロガーなつです。 Lightningはシンプルな無料テーマなのでどんな画像や素材、色でも合わせやすいテンプレートです。基本となる部分はすべてそろっていますのでうまく...]]></description>
										<content:encoded><![CDATA[<p>こんにちは！ブログ運営半年で月20万超の元サラリーマンブロガーなつです。</p>
<p>Lightningはシンプルな無料テーマなのでどんな画像や素材、色でも合わせやすいテンプレートです。基本となる部分はすべてそろっていますのでうまくデザインができるととても使いやすいので、自分で色のカスタマイズをしてみてください。</p>
<p><strong>WordPressテーマのLightningをカスタママイズした作成例</strong>をお伝えしていきます。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>　<span style="font-size: 14pt;"><strong>2023年、話題のワードプレステーマ「THE THOR」</strong></span><br />
<strong>⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE・THORの公式ページを確認する。</a></strong></p>
<p>※　今なら、8大購入特典をプレゼント！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-hyouban"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2019/07/thorkutikomi-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの評判】実際使ってみた口コミとレビュー。</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>Lightningのカスタマイズのコツ</h2>
<p>Lightningは基本が白基調で清潔感があります。ヘッダーなどに合わせるのはイラストもよいのですが、写真ベースの画像もかっこよく収まります。</p>
<p>趣味のブログなどでは、自分で撮った写真があればそれをヘッダーに飾っても愛着がわきますし、色を重ねたりスライダーにしても面白いです。</p>
<p>ヘッダー画像のサイズは少し横長に調整して使うとかっこよく仕上がります。</p>
<p>（ここでは、プラグインを使わずにできるだけシンプルにヘッダーを作っていく工程をお伝えします）</p>
<p>&nbsp;</p>
<h3>Lightningの作成例</h3>
<p>Lightningの良さはシンプルな部分ですので、今回のアレンジは追加CSSなど使わずに初心者にもできるように作っています。画像等の大きさは一応推奨サイズがありますが、そのままではなくてもある程度は調整できる部分をみていただきたいので、あえていろんな大きさを配置しています。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>  <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」！</strong></span><br />
⇒<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する</a><br />
※今なら、8大購入特典をお付けしています！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></div></div>

<p>&nbsp;</p>
<h2>Lightningのカスタマイズ作成例　1.　カフェ用アレンジ</h2>
<p>ヘッダー部分の画像の縦が若干長くなっていますが、透過で人気のカフェメニューなどを追加してもいいですし、お店の内部画像などもあればイメージしやすくなります。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/cafe.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-6700 size-medium" src="https://blognote01.com/wp-content/uploads/2020/01/cafe-127x300.jpg" alt="カフェ用ページ例" width="127" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/cafe-127x300.jpg 127w, https://blognote01.com/wp-content/uploads/2020/01/cafe-433x1024.jpg 433w, https://blognote01.com/wp-content/uploads/2020/01/cafe.jpg 500w" sizes="(max-width: 127px) 100vw, 127px" /></a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">ロゴの大きさ</td>
<td style="width: 50%;">403 x 159px</td>
</tr>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">638×287px</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#f6ad49</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#aacf53</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#e8d3d1</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">40％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">左</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#e8d3d1</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<p>&nbsp;</p>
<p>ヘッダー画像が推奨サイズより少し高めです。画像から出てしまうこともあるので、高さ調整しながら作っていきましょう。</p>
<h3>作成のポイント</h3>
<p>ヘッダー画像を木目にしてあるので、オーガニックのカフェやその他インテリアなどのブログに使えます。オレンジと抹茶のような対象的な色を合わせてみました</p>
<p>&nbsp;</p>
<div class="cbox intitle is-style-red_box type_normal"><div class="box_title"><span class="span__box_title">THE THORオリジナルデザインプレゼント中！</span></div><div class="cboxcomment"><strong>当ブログのTHE THORオリジナルテンプレート！</strong></p>
<p>このブログからTHE THORをご購入くださった方に<strong>マニュアル</strong>をプレゼントしています。</p>
<p><div class="column-wrap "><br />
<div class="column_3 child_column "><a href="http://blognote01.com/cafe/" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-9544" src="https://blognote01.com/wp-content/uploads/2020/04/torlwata-300x221.jpg" alt="THE THOR特典デザイン「綿毛」" width="300" height="221" srcset="https://blognote01.com/wp-content/uploads/2020/04/torlwata-300x221.jpg 300w, https://blognote01.com/wp-content/uploads/2020/04/torlwata.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
追加特典「<a href="http://blognote01.com/cafe/" target="_blank" rel="noopener">綿毛</a>」</div><br />
<div class="column_3 child_column "><a href="http://blognote01.com/thethorsimple" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-5560" src="https://blognote01.com/wp-content/uploads/2019/11/sinpuru2-300x263.jpg" alt="THE THOR特典デザイン「シンプル」" width="300" height="263" srcset="https://blognote01.com/wp-content/uploads/2019/11/sinpuru2-300x263.jpg 300w, https://blognote01.com/wp-content/uploads/2019/11/sinpuru2.jpg 648w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
特典「<a href="http://blognote01.com/thethorsimple" target="_blank" rel="noopener">シンプル</a>」</div><br />
<div class="column_3 child_column "><a href="http://blognote01.com/restaurant/" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-9541" src="https://blognote01.com/wp-content/uploads/2020/04/torlresut-300x226.jpg" alt="THE" width="300" height="226" srcset="https://blognote01.com/wp-content/uploads/2020/04/torlresut-300x226.jpg 300w, https://blognote01.com/wp-content/uploads/2020/04/torlresut.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
追加特典「<a href="http://blognote01.com/restaurant/" target="_blank" rel="noopener">ai</a>」</div> </div></p>
<p>※他のデザインは以下の記事で見れますので覧ください。<br />
⇒<a href="https://blognote01.com/thethor-design6" target="_blank" rel="noopener noreferrer">【簡単】THE THORデザインの事例集6選！初心者でも作れるアレンジを紹介！</a></p>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a class="btn__link btn__link-primary wp-block-button__link" href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1">特典付きでTHE THORを購入する</a></div></p>
<p><center>／／今なら、なつ特製オリジナルデザインマニュアル付き！＼＼</center><center></center><center></center><center></center><br />
<span style="font-size: 10pt;">※ヘッダーの画像は、写真ACとイラストACのイラストレーターさん方の作品です。特典内でURLをお伝えしています。</span></div></div>

<p>&nbsp;</p>
<p>&nbsp;</p>
<h2>Lightningのカスタマイズ作成例　2.　　個人ブログアレンジ</h2>
<p>個人のブログなので自由度が高いです。稼ぐためのブログならばご自身がブログで記事にしたいジャンルがイメージできるイラストや画像を配置すればいいですし、趣味や日記ならば見た目に華やかな画像を追加してもうるさくなりません。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning31.jpg"><img loading="lazy" decoding="async" class="wp-image-6708 size-medium aligncenter" src="https://blognote01.com/wp-content/uploads/2020/01/litning31-113x300.jpg" alt="個人ブログ用のアレンジページ" width="113" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning31-113x300.jpg 113w, https://blognote01.com/wp-content/uploads/2020/01/litning31-386x1024.jpg 386w, https://blognote01.com/wp-content/uploads/2020/01/litning31.jpg 500w" sizes="(max-width: 113px) 100vw, 113px" /></a></p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">ヘッダー画像の大きさ</td>
<td style="width: 50%;">1600×1200px</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#e7609e</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#f6ad49</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#ffec47</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">30％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">左</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#e7609e</td>
</tr>
<tr>
<td style="width: 50%;">文字の影の色</td>
<td style="width: 50%;">#f2f2b0</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<p>&nbsp;</p>
<p>ヘッダー画像が推奨サイズより少し高めです。鳥のポイント画像を全部見せたかったので高くなっています。</p>
<p>高さ調節して上下を切って配置してもよいでしょう。</p>
<h3>作成のポイント</h3>
<p>透過の画像（PNG）をヘッダーにもってきて、その上に色を重ねました。JPGのように元の色がない分ヘッダーがクリアに見えます。白がベースなので、写真系も合うのですがイラストもかわいく収まります。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<h2>Lightningのカスタマイズ作成例　3.　　美容系アレンジ</h2>
<p>美容サロン、ネイル、痩身などさまざまな美容系のサロンがあります。高級感とシンプルなセンスの良さをアピールするために背景とタイトルだけにしています。センスの良い背景はたくさんありますので、探してみてくださいね。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning32.jpg"><img loading="lazy" decoding="async" class="wp-image-6710 size-medium aligncenter" src="https://blognote01.com/wp-content/uploads/2020/01/litning32-114x300.jpg" alt="美容系アレンジデザイントップページ" width="114" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning32-114x300.jpg 114w, https://blognote01.com/wp-content/uploads/2020/01/litning32-388x1024.jpg 388w, https://blognote01.com/wp-content/uploads/2020/01/litning32.jpg 498w" sizes="(max-width: 114px) 100vw, 114px" /></a></p>
<p>&nbsp;</p>
<table style="height: 207px; width: 100%; border-style: solid; border-color: #c9c9c9; border-collapse: collapse; background-color: #fcfceb;">
<tbody>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">ヘッダー画像の大きさ</td>
<td style="width: 50%; height: 23px;">1588 x 1135 ピクセル</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">キーカラー</td>
<td style="width: 50%; height: 23px;">#b44c97</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">キーカラー（暗）</td>
<td style="width: 50%; height: 23px;">#7a4171</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">サイドバーの位置</td>
<td style="width: 50%; height: 23px;">左</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%; height: 23px;">#e597b2</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%; height: 23px;">30％</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">文字の位置</td>
<td style="width: 50%; height: 23px;">左</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">文字の色</td>
<td style="width: 50%; height: 23px;">#6f514c</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">文字の影の色</td>
<td style="width: 50%; height: 23px;">#9cb1ba</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<h3>作成のポイント</h3>
<p>ヘッダーの画像をあえて背景につかうような柄を配置しています。できるだけラグジュアリー感を出そうとパープルを基調にしています。</p>
<p>背景にきらきらしたグラデーションの画像をもってきてもカッコいいかもしれません。</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<h2>Lightningのカスタマイズ作成例　4.　コンサル用アレンジ</h2>
<p>幾何学模様の背景をヘッダーに配置してみました。地の青色は、イメージ的に「信頼」の色ですので、信用が必要なコンサルなどにはこういったデザインでいいと思います。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning33.jpg"><img loading="lazy" decoding="async" class="wp-image-6711 size-medium aligncenter" src="https://blognote01.com/wp-content/uploads/2020/01/litning33-123x300.jpg" alt="コンサルサイト用アレンジ" width="123" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning33-123x300.jpg 123w, https://blognote01.com/wp-content/uploads/2020/01/litning33-421x1024.jpg 421w, https://blognote01.com/wp-content/uploads/2020/01/litning33.jpg 500w" sizes="(max-width: 123px) 100vw, 123px" /></a></p>
<p>&nbsp;</p>
<table style="height: 205px; width: 100%; border-style: solid; border-color: #c9c9c9; border-collapse: collapse; background-color: #fcfceb;">
<tbody>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">画像の大きさ</td>
<td style="width: 50%; height: 23px;">640 x 427 ピクセル</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">キーカラー</td>
<td style="width: 50%; height: 23px;">#59b9c6</td>
</tr>
<tr style="height: 17px;">
<td style="width: 50%; height: 17px;">キーカラー（暗）</td>
<td style="width: 50%; height: 17px;">#274a78</td>
</tr>
<tr style="height: 23px;">
<td style="width: 50%; height: 23px;">サイドバーの位置</td>
<td style="width: 50%; height: 23px;">左</td>
</tr>
<tr style="height: 24px;">
<td style="width: 50%; height: 24px;">文字の位置</td>
<td style="width: 50%; height: 24px;">真ん中</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<h3>作成のポイント</h3>
<p>ビジネス用を意識して作っています。SNSコンサルとなっていますがキチンとしたタイトルをつけるとぐっとよくなります。青を基調にしたので単調ではありますが、誠実さをだすならこういった色合いが良いでしょう。</p>
<h2>Lightningのカスタマイズ作成例　5.　　恋愛系アレンジ</h2>
<p>恋愛系はやはり花・ハート・星などのものが似合います。キラキラしているものなども合います。このヘッダーは花の画像を配置しピンクの色を重ねています。</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning34.jpg"><img loading="lazy" decoding="async" class="wp-image-6713 size-medium aligncenter" src="https://blognote01.com/wp-content/uploads/2020/01/litning34-123x300.jpg" alt="恋愛用ブログアレンジ" width="123" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning34-123x300.jpg 123w, https://blognote01.com/wp-content/uploads/2020/01/litning34-421x1024.jpg 421w, https://blognote01.com/wp-content/uploads/2020/01/litning34.jpg 499w" sizes="(max-width: 123px) 100vw, 123px" /></a></p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">640 x 427 ピクセル</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#e9546b</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#274a78</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#e9546b</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">20％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#d7003a</td>
</tr>
<tr>
<td style="width: 50%;">背景の色</td>
<td style="width: 50%;">#fdeff2</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<h3>作成のポイント</h3>
<p>恋愛系の女性にも、恋愛商材などにも使えるように作ってみました。とにかくピンクピンクピンクと花で飾っています。恋愛系なのでブログで得る情報でハッピーになるイメージですが、花でなくともハートなどの壁紙でもよいと思います。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<h2>Lightningのカスタマイズ作成例　5.　　スポーツ系アレンジ</h2>
<p>スポーツ系はそれぞれのフィールドや器具そして靴などの画像もいいと思います。以下はちょっと運動会の旗を配置し運動会の行事っぽくなっています。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning33-2.jpg"><img loading="lazy" decoding="async" class="wp-image-9972 size-medium aligncenter" src="https://blognote01.com/wp-content/uploads/2020/01/litning33-2-144x300.jpg" alt="スポーツ系ブログトップページアレンジ" width="144" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning33-2-144x300.jpg 144w, https://blognote01.com/wp-content/uploads/2020/01/litning33-2-490x1024.jpg 490w, https://blognote01.com/wp-content/uploads/2020/01/litning33-2.jpg 499w" sizes="(max-width: 144px) 100vw, 144px" /></a></p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">1000 x 320 ピクセル</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#ffd900</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#c7dc68</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#c3d825</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">10％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">真ん中</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#fabf14</td>
</tr>
<tr>
<td style="width: 50%;">背景画像</td>
<td style="width: 50%;">あり</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<p>&nbsp;</p>
<p>背景をすこし凝ってみました。</p>
<h3>作成のポイント</h3>
<p>スポーツ系は「健康」「元気」「ビタミン」みたいなイメージで作っています。黄色を基調にして元気さをアピールし、運動会のようなヘッダー画像をもってきています。</p>
<p>&nbsp;</p>
<h2>Lightningのカスタマイズ作成例　6.　　エンタメ・アドセンス</h2>
<p>ヘッダーに習字の画像を配置し印と合成しています。こういったヘッダーについては、<a href="https://blognote01.com/blog-headersakusei" target="_blank" rel="noopener">CANVAというツール</a>が役立ちます。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大<br />
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning35.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-6718 size-medium" src="https://blognote01.com/wp-content/uploads/2020/01/litning35-145x300.jpg" alt="エンタメ系サイトトップページ" width="145" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning35-145x300.jpg 145w, https://blognote01.com/wp-content/uploads/2020/01/litning35-495x1024.jpg 495w, https://blognote01.com/wp-content/uploads/2020/01/litning35.jpg 500w" sizes="(max-width: 145px) 100vw, 145px" /></a></p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">1900×600px</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#17184b</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#2f4a6b</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#ebd842</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">30％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">左</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#59b9c6</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<p>&nbsp;</p>
<p>ヘッダー画像を作りこんでみました。習字のようなオブジェっぽいものに印を付けてそれっぽくしています。</p>
<h3>作成のポイント</h3>
<p>エンタメや芸能ブログはかなりの激戦区です。同じ題材を一気に更新して熾烈な上位争いとなりますのでブログもかなりインパクトが必要ということで「和風」で見た目でも印象深くするために勢いのある墨字にしてみました。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<h2>Lightningのカスタマイズ作成例　7.　　就職系</h2>
<p>就職系はブログを作る人も多いので、フリーでも最適な画像がたくさんあります。こちらは、上下を切り取り人の背丈分の高さにしています。</p>
<p>&nbsp;</p>
<p style="text-align: center;">↓　クリックで拡大</p>
<a href="https://blognote01.com/wp-content/uploads/2020/01/litning37.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-6723 size-medium" src="https://blognote01.com/wp-content/uploads/2020/01/litning37-159x300.jpg" alt="就職系サイトトップページアレンジ" width="159" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning37-159x300.jpg 159w, https://blognote01.com/wp-content/uploads/2020/01/litning37.jpg 420w" sizes="(max-width: 159px) 100vw, 159px" /></a>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">1900×600px</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#008899</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#2f4a6b</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">左</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#ffffff</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<h3>作成のポイント</h3>
<p>就職系のブログはやはり青もしくはグレーなどの落ち着いた色が似あいます。特にこの先就職が「成功」するためにさわやかで希望溢れるTOPページとしてみました。</p>
<p>&nbsp;</p>
<h2>Lightningのカスタマイズ作成例　7.　　英会話　　【Wordpressテーマ】</h2>
<p>英会話・留学といえば、「どこか外国の街並み」「飛行機」などをヘッダーにもってくるとイメージしやすくて良いです。</p>
<p style="text-align: center;">↓　クリックで拡大<a href="https://blognote01.com/wp-content/uploads/2020/01/litning38.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-6724 size-medium" src="https://blognote01.com/wp-content/uploads/2020/01/litning38-144x300.jpg" alt="英会話系トップページアレンジ" width="144" height="300" srcset="https://blognote01.com/wp-content/uploads/2020/01/litning38-144x300.jpg 144w, https://blognote01.com/wp-content/uploads/2020/01/litning38-493x1024.jpg 493w, https://blognote01.com/wp-content/uploads/2020/01/litning38.jpg 499w" sizes="(max-width: 144px) 100vw, 144px" /></a></p>
<p>&nbsp;</p>
<table style="width: 100%; border-collapse: collapse; border-style: solid; border-color: #c9c9c9; background-color: #fcfceb;">
<tbody>
<tr>
<td style="width: 50%;">画像の大きさ</td>
<td style="width: 50%;">1900×600px</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー</td>
<td style="width: 50%;">#595857</td>
</tr>
<tr>
<td style="width: 50%;">キーカラー（暗）</td>
<td style="width: 50%;">#002f42</td>
</tr>
<tr>
<td style="width: 50%;">サイドバーの位置</td>
<td style="width: 50%;">右</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色（任意）</td>
<td style="width: 50%;">#522f60</td>
</tr>
<tr>
<td style="width: 50%;">ヘッダーへ被せる色の濃さ</td>
<td style="width: 50%;">50％</td>
</tr>
<tr>
<td style="width: 50%;">文字の位置</td>
<td style="width: 50%;">真ん中</td>
</tr>
<tr>
<td style="width: 50%;">文字の色</td>
<td style="width: 50%;">#fef263</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<ul>
<li>ロゴ推奨画像サイズ: 280×60px</li>
<li>ヘッダー推奨画像サイズ: 1900×600px</li>
</ul>
<h3>作成のポイント</h3>
<p>NYの夜景の画像にさらに紫色をかぶせて反対色の黄色を文字色にしました。写真画像を入れるとうまく収まるのでサイズ調整でできればいい感じになります。</p>
<p>&nbsp;</p>
<h2>Lightningのカスタマイズ作成　　まとめ</h2>
<p>Lightningは、専用のプラグインを入れてさらに機能を増やして使うようになっていますが、プラグインなしでもここまでできます。</p>
<p>トップページには、URLへの誘導ボタンがスマートに配置できるのでシンプルかつ見やすいサイトとなります。</p>
<p>さらに、ここまで作るのにそれほど時間もかかりませんので<a href="https://blognote01.com/perasite-template" target="_blank" rel="noopener">ペラサイト</a>にも使え重宝します。</p>
<p>&nbsp;</p>
<p><strong>↓　当ブログからWordpressテーマTHE THORを購入くださった方に特典をプレゼントしています。</strong><br />
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></p>

<h2>初心者だからこそWordpress有料テーマ を使うべき理由</h2>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><br />
<span style="font-size: 12pt;"><strong>無料テーマを使うことで時間の無駄遣いをしていませんか？</strong></span></p>
<ul>
<li>思い通りのデザインにできない・・・</li>
<li>なかなか稼げない・・・</li>
<li>アクセス数が増えない・・・</li>
</ul>
<p>こんな悩みを抱えていませんか？<br />
&nbsp;</p>
<p>稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。</p>
<p>&nbsp;</p>
<h3>Wordpressの有料テーマができる５つのこと</h3>
<ol>
<li>検索上位を目指せる</li>
<li>見た目が綺麗でおしゃれになる</li>
<li>機能が豊富で出来ることが多い</li>
<li>会員フォームなどのサポート</li>
<li>有名ブロガーも有料テーマを使っている</li>
</ol>
<p>&nbsp;</p>
<p>これまでにあげた5つの有料テーマの特徴を説明していきます。</p>
<h4>1.　検索上位を目指せる</h4>
<p>ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。</p>
<ul>
<li>情報の信頼性</li>
<li>ユーザーへの役立つ情報であるか？</li>
<li>スマホ・PCなどでストレスなく使える</li>
</ul>
<p>&nbsp;</p>
<p>などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。</p>
<p>&nbsp;</p>
<h4>2.　見た目が無料テーマ以上に綺麗になる</h4>
<p>シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。</p>
<p>有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。</p>
<p style="text-align: center;"><img loading="lazy" decoding="async" class="size-medium wp-image-9942 aligncenter" src="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg" alt="" width="300" height="218" srcset="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg 300w, https://blognote01.com/wp-content/uploads/2020/05/THOR222.jpg 650w" sizes="(max-width: 300px) 100vw, 300px" />出典：THE THOR 着せ替え「01」</p>
<p style="text-align: center;"><strong>↓　クリックで拡大します</strong><br />
<a href="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-11133 size-medium" src="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg" alt="" width="300" height="169" srcset="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1024x576.jpg 1024w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1536x864.jpg 1536w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-2048x1152.jpg 2048w" sizes="(max-width: 300px) 100vw, 300px" /></a>出典：<a href="https://blognote01.com/thethor-newarrange" target="_blank" rel="noopener noreferrer">特製THE THORオリジナルアレンジ</a></p>
<p>&nbsp;</p>
<h4>3.　機能が豊富でできることが多い</h4>
<p>今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。</p>
<h4>4.　会員フォーラムなどのサポート</h4>
<p>なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。</p>
<h4>5.　有名ブロガーも多数使用</h4>
<p>稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。</p>
<p>もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。</p>
<p>カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。</p>
<p><div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">当ブログおすすめWordpressテーマ！</span></div><div class="cboxcomment"><br />
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2019/05/nigaoemaker-e1558864804973.png" alt="" width="96" height="96" class="alignnone  wp-image-1393" /><br />
<span style="font-size: 14pt;"><strong><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">WordPressテーマ「THE・THOR」</a></strong></span></p>
<ul>
<li>高機能の最新テーマで有名ブロガーも使用</li>
<li>着せ替え機能でいろんな用途に使える</li>
<li>複数のブログに使える（本人のブログ）</li>
<li>会員フォーラムやマニュアル完備</li>
</ul>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://blognote01.com/thethor-tokuten" target="_blank" rel="noopener"class="wp-block-button__link" >THE THORの8大特典を見てみる！</a></div><br />
</div></div>
<br />
</div></div>

]]></content:encoded>
					
					<wfw:commentRss>https://blognote01.com/wordpresslightning-demo/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">6691</post-id>	</item>
		<item>
		<title>Lightningのカスタマイズと使い方！WordPress初心者でもできるブログ例！</title>
		<link>https://blognote01.com/wordpress-ightningcustomiz</link>
					<comments>https://blognote01.com/wordpress-ightningcustomiz#respond</comments>
		
		<dc:creator><![CDATA[なつ]]></dc:creator>
		<pubDate>Tue, 31 Dec 2019 10:16:06 +0000</pubDate>
				<category><![CDATA[Lightning]]></category>
		<category><![CDATA[WordPress （ワードプレス）使い方]]></category>
		<guid isPermaLink="false">https://blognote01.com/?p=6658</guid>

					<description><![CDATA[こんにちは！ブログ運営半年で月20万超の元サラリーマンブロガーなつです。 WordPressの無料テーマの中でビジネスやホームページにも使えるLightningは人気のテンプレートです。超シンプルな作りですが、必要な項目...]]></description>
										<content:encoded><![CDATA[<p>こんにちは！ブログ運営半年で月20万超の元サラリーマンブロガーなつです。</p>
<p>WordPressの無料テーマの中でビジネスやホームページにも使えるLightningは人気のテンプレートです。超シンプルな作りですが、必要な項目はキチンと備えているために使いやすいです。</p>
<p><strong>WordPressテーマLightningのインストールからカスタマイズまで説明していきます。</strong></p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>　<span style="font-size: 14pt;"><strong>2023年、話題のワードプレステーマ「THE THOR」</strong></span><br />
<strong>⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE・THORの公式ページを確認する。</a></strong></p>
<p>※　今なら、8大購入特典をプレゼント！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-hyouban"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2019/07/thorkutikomi-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの評判】実際使ってみた口コミとレビュー。</div></div></a></div></div></div>

<h2>Lightningのカスタマイズでできること</h2>
<p>Lightningは基本のデザイン構成がしっかりしていてとても見やすいブログになります。用意されたプラグインなしでも以下のようなトップページが仕上がります。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain18.jpg" alt="" width="500" height="434" class="aligncenter wp-image-15091 size-full" srcset="https://blognote01.com/wp-content/uploads/2021/05/lidezain18.jpg 500w, https://blognote01.com/wp-content/uploads/2021/05/lidezain18-300x260.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p style="text-align: center;"><span style="font-size: 10pt;"><strong>↑　Lightningの基礎機能だけで作ったTOPページ</strong></span></p>
<p>&nbsp;</p>
<p>Lightningの無料テーマは基本的にはシンプルです。カスタマイズもシンプルではありますが無料なのにブログに必要な機能が備わっています。</p>
<p>&nbsp;</p>
<ul>
<li>見てほしい部分をアピールするPRブロック</li>
<li>ユーザーの行動喚起を誘導するCTA</li>
<li>会社の情報やプロフィールなど明記</li>
<li>お問い合わせ先情報表示</li>
</ul>
<p>&nbsp;</p>
<p>どちらかといえば、個人の趣味ブログというよりもビジネスのために用意された機能が多いです。なにより、Wordpressの公式ディレクトリとして登録されていますので安心感もあります。</p>
<p>&nbsp;</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/lightning-design"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2021/05/lidezain742-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>WordPressデザイン無料テーマ「Lightning」でどんなことができる？</div><time class="time__date gf undo">2022.02.11</time></div></a></div>
<p>&nbsp;</p>
<h2>WordPress Lightningのカスタマイズ　1.　「インストール」</h2>
<p>Lightningは、Wordpressの公式ディレクトリで認定されていますので「Twenty Twenty」や「Twenty nineteen」などの公式から配布されているテーマの中からインストールします。</p>
<p>&nbsp;</p>
<p><span style="background-color: #ffc6d1;">▼　外観　⇒　テーマ　⇒　新規追加</span></p>
<p>&nbsp;</p>
<h3>インストールの手順</h3>
<ol>
<li>テーマの検索をする。</li>
<li>テーマのインストールボタンをクリック</li>
<li>有効化</li>
</ol>
<p>&nbsp;</p>
<h4>1.　テーマの検索をする</h4>
<p>テーマの追加画面の右上で「テーマを検索」欄にLightningと入力してください。検索窓に名前を入力すれば該当のテーマが出てきます。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6662 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning4.jpg" alt="Wordpressテーマ検索方法" width="600" height="269" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning4.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning4-300x135.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>&nbsp;</p>
<h4>2.　テーマのインストールボタンをクリック</h4>
<p>検索をかけると左上にLightningがでてきます。画面にカーソル（指）をもっていくと詳細＆プレビューやインストールのボタンがでてきますのでクリックしてください。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6663 size-medium" src="https://blognote01.com/wp-content/uploads/2019/12/litning6-300x237.jpg" alt="Wordpressテーマインストールボタン" width="300" height="237" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning6-300x237.jpg 300w, https://blognote01.com/wp-content/uploads/2019/12/litning6.jpg 518w" sizes="(max-width: 300px) 100vw, 300px" />
<p>&nbsp;</p>
<h4>3.　有効化</h4>
<p>インストールが終わると有効化ボタンがでてきますのでこちらもクリック。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-6664" src="https://blognote01.com/wp-content/uploads/2019/12/litning7-300x237.jpg" alt="Wordpressテーマ有効化ボタン" width="300" height="237" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning7-300x237.jpg 300w, https://blognote01.com/wp-content/uploads/2019/12/litning7.jpg 515w" sizes="(max-width: 300px) 100vw, 300px" />
<p>これでインストールが完了しました。</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i>  <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」！</strong></span><br />
⇒<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する</a><br />
※今なら、8大購入特典をお付けしています！</p>
<p><div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/thethor-tokuten"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-485x273.jpg 485w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2019/09/8daitokuten.jpg 800w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>【THE THORの8大特典！】ザ・トールの購入時の割引も調査。（WordPressテーマ）</div></div></a></div></div></div>

<h3>VK All in One Expansion Unit (Free)のインストール</h3>
<p>Lightningには機能を拡張する専用のプラグインがあります。それがVK All in One Expansion Unit (Free)です。このプラグインは、Lightningをインストールすると一緒に導入できるようになっていますのでインストールしてください。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-6665" src="https://blognote01.com/wp-content/uploads/2019/12/litning8-300x226.jpg" alt="プラグインのインストール" width="300" height="226" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning8-300x226.jpg 300w, https://blognote01.com/wp-content/uploads/2019/12/litning8.jpg 401w" sizes="(max-width: 300px) 100vw, 300px" />
<p>この状態ではまだインストールできていないので、画面を展開し「インストール」をクリックします。</p>
<div class="supplement "><strong>補足</strong><br />
次の推奨プラグインは現在、停止中ですと出てきた場合</p>
<p>インストールの操作だけならまだ使えないのでVK All in One Expansion Unit (Free)の有効化を忘れずにしてください。</p>
<ol>
<li>プラグインの有効化を開始をクリック</li>
<li>インストール済みのプラグインで有効化</li>
</ol>
</div>
<p>&nbsp;</p>
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/blogillust-free"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="300" src="https://blognote01.com/wp-content/uploads/2020/01/ブログで使える-無料イラスト-1-485x300.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>ブログで使えるイラスト25選！フリー（無料）素材でサイトをパワーアップ！</div><time class="time__date gf undo">2022.08.08</time></div></a></div>
<p>&nbsp;</p>
<h2>WordPress Lightningのカスタマイズ　2.　「カスタマイズの種類」</h2>
<img loading="lazy" decoding="async" class="alignnone wp-image-6667 size-medium" src="https://blognote01.com/wp-content/uploads/2019/12/litning9-150x300.jpg" alt="カスタマイズサイドバー" width="150" height="300" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning9-150x300.jpg 150w, https://blognote01.com/wp-content/uploads/2019/12/litning9.jpg 348w" sizes="(max-width: 150px) 100vw, 150px" />
<ul>
<li>サイト基本情報</li>
<li>色</li>
<li>背景画像</li>
<li>メニュー</li>
<li>ウィジェット</li>
<li>ホームページ設定</li>
<li>Lightning Font Awesome</li>
<li>Lightning 機能設定</li>
<li>Lightning デザイン設定</li>
<li>Lightning トップページスライドショー</li>
<li>Lightning トップページ PR Block</li>
<li>エクスポート/インポート</li>
</ul>
<p>&nbsp;</p>
<p>上半分は一般のカスタマイズで下半分はLightningのカスタマイズになっています。この先は、Lightningの特徴的なカスタマイズを解説していきます。</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<h2>WordPressのカスタマイズ　3.　「Lightning デザイン設定」</h2>
<ol>
<li>ヘッダーロゴ変更</li>
<li>色設定</li>
<li>レイアウト設定</li>
<li>その他の設定</li>
</ol>
<p>&nbsp;</p>
<h3>1.　ヘッダーロゴ変更</h3>
<p>「画像を選択」をクリックし画像を追加します。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-6669" src="https://blognote01.com/wp-content/uploads/2019/12/litning13-300x180.jpg" alt="Wordpressテーマカスタマイズヘッダーロゴ変更" width="300" height="180" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning13-300x180.jpg 300w, https://blognote01.com/wp-content/uploads/2019/12/litning13-486x290.jpg 486w, https://blognote01.com/wp-content/uploads/2019/12/litning13.jpg 500w" sizes="(max-width: 300px) 100vw, 300px" />
<p><strong><span style="color: #be3144;">推奨画像サイズ・・・280×60px</span></strong></p>
<p>&nbsp;</p>
<h3>2.　色設定</h3>
<p>色はキーカラーの2色が設定可能です。色設定は、合わせるのが難しいと感じる方も多いので、シンプルに2色くらいが初心者にとっても良いでしょう。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6670 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning14.jpg" alt="Lightning PRブロック色変更" width="600" height="265" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning14.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning14-300x133.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>&nbsp;</p>
<h3>3.　レイアウト設定</h3>
<p>レイアウト設定はPCでブログを見たときにサイドバーの位置を左右どちらかにするかと、トップページを1カラムにするかの設定ができます。</p>
<p>&nbsp;</p>
<h3>4.　その他の設定</h3>
<p>その他の設定で必要に応じてチェックを入れていきます。</p>
<ul>
<li>トップページでデフォルトの投稿リストや固定ページを表示しない</li>
<li>投稿詳細ページで最終更新日を表示しない</li>
<li>投稿詳細ページで投稿者名を表示しない</li>
<li>固定ページのサイドバーに非アクティブな孫ページを表示しない</li>
</ul>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><i class="fas fa-check"></i> <span style="font-size: 14pt;"><strong>初心者でも簡単にカスタマイズできるワードプレステーマ「THE・THOR」</strong></span><br />
⇒　<a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">THE THORの公式ページを確認する。</a></p>
<p>※今なら、8大購入特典をお付けしています！</div></div>

<p>&nbsp;</p>
<h2>Lightningのカスタマイズ　4.　「トップページスライドショー」</h2>
<p>Lightningでは、トップページをスライドショーにすることができます。スライドショーの画像は5枚まで設定可能。</p>
<ol>
<li>スライド効果</li>
<li>スライド切り替え間隔</li>
<li>スライド画像に被せる色</li>
<li>スライド画像に被せる割合</li>
<li>リンク先URL</li>
<li>スライドテキスト</li>
<li>ボタンの文字</li>
<li>文字色</li>
</ol>
<p>&nbsp;</p>
<h3>1.　スライド効果</h3>
<p>スライド効果は2種類です。</p>
<ul>
<li>Slide・・・横からスライド</li>
<li>fade・・・全体的にフェードアウト</li>
</ul>
<p>&nbsp;</p>
<h3>2.　スライド切り替え間隔</h3>
<p>こちらは、スライドの切り替えの間隔を調整できます。ご自身で実際にスライドさせながらちょうどよい秒数を入力してみてください。</p>
<p>&nbsp;</p>
<h3>3.　スライド画像に被せる色</h3>
<p>スライドの画像に色をかぶせることができます。画像自体が暗いとかぼんやりしているなどヘッダー画像が寂しく感じた時などは色を重ねると華やかになります。</p>
<p>&nbsp;</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6671 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning15.jpg" alt="Lightningヘッダー画像に色をかぶせる方法" width="600" height="301" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning15.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning15-300x151.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>&nbsp;</p>
<p>&nbsp;</p>
<h3>4.　スライド画像に被せる割合</h3>
<p>スライドに色をかぶせた場合どれくらいの濃さにしたいかをパーセンテージで入力します。上の画像では50％の濃さにしてあります。</p>
<p>&nbsp;</p>
<p><strong>↓　Lightningの機能は以下のページでどうぞ。</strong><br />
<div class="related_article typesimple"><a class="related_article__link no-icon" href="https://blognote01.com/lightning-kinou"><figure class="eyecatch of-cover thum"><img loading="lazy" decoding="async" width="485" height="273" src="https://blognote01.com/wp-content/uploads/2019/09/Lightningの機能.jpg" class="archives-eyecatch-image attachment-oc-post-thum wp-post-image" alt="" srcset="https://blognote01.com/wp-content/uploads/2019/09/Lightningの機能.jpg 560w, https://blognote01.com/wp-content/uploads/2019/09/Lightningの機能-300x169.jpg 300w" sizes="(max-width: 485px) 45vw, 485px" /></figure><div class="related_article__meta archives_post__meta inbox"><div class="related_article__ttl ttl"><span class="labeltext">関連記事</span>Lightning（WordPressテーマ）の機能！拡張プラグインでさらにパワーアップ！</div><time class="time__date gf undo">2022.01.01</time></div></a></div>
<p>&nbsp;</p>
<h3>5.　リンク先URL</h3>
<p>画像の上に誘導ボタンと文字を設定できます。設定できる項目は以下の通り。</p>
<ul>
<li>リンク先</li>
<li>スライドタイトル</li>
<li>スライドテキスト</li>
<li>ボタンの文字</li>
<li>位置</li>
</ul>
<img loading="lazy" decoding="async" class="alignnone wp-image-6672 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning16.jpg" alt="Lightningヘッダー画像リンクURL設定" width="600" height="404" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning16.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning16-300x202.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>&nbsp;</p>
<h3>6.　スライドテキスト</h3>
<p>スライドテキストは任意ですので必要ない場合には入力なしでも大丈夫です。動きが欲しい時にはタイトルや説明を入れてみましょう。</p>
<p>&nbsp;</p>
<h3>7.　ボタンの文字</h3>
<p>ボタンの文字も編集ができます。デフォルトは「READ　MORE」となっていますので「詳細はコチラ」などわかりやすいものを入力してください。</p>
<p>&nbsp;</p>
<h3>8.　文字色</h3>
<p>スライド上での文字の色の設定も可能です。文字の影もつけることができ影の色もおなじようにこの場所でカスタマイズできます。</p>
<p>&nbsp;</p>
<p>スライダーに加えたい画像の枚数分同じように設定していってください。</p>
<p>&nbsp;</p>
<p>↓　Wordpressテーマ「THE THOR」公式デザインに芸大卒なつのデザイン10種類追加！</p>
<div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">THE THORデザインのマニュアルプレゼント中！</span></div><div class="cboxcomment"><strong>人気のTHE THORのオリジナルテンプレート6種類+5種類（NEW）ができました！</strong></p>
<p>当ブログで購入していただくと、公式の9種類のデザインと追加の10種類が無料で手に入ります！</p>
<p><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" target="_blank" rel="noopener"><img loading="lazy" decoding="async" class="aligncenter wp-image-18090 size-full" src="https://blognote01.com/wp-content/uploads/2021/10/9shu.jpg" alt="THE THOR特典オリジナルアレンジマニュアルバナー" width="500" height="281" srcset="https://blognote01.com/wp-content/uploads/2021/10/9shu.jpg 500w, https://blognote01.com/wp-content/uploads/2021/10/9shu-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2021/10/9shu-375x211.jpg 375w" sizes="(max-width: 500px) 100vw, 500px" /></a></p>
<p>※デザインの全体像は以下の2記事をご覧ください。</p>
<p><strong>⇒<a href="https://blognote01.com/thethor-design6" target="_blank" rel="noopener noreferrer">【超簡単】THE THORデザインの事例集6選！初心者でも作れるアレンジ！</a><br />
</strong>⇒<strong><a href="https://blognote01.com/thethor-originaltokuten" target="_blank" rel="noopener noreferrer">追加デザイン4種はコチラから</a></strong>見ることができます。</p>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored"class="wp-block-button__link" >特典付きでTHE THORを購入する</a></div></p>
<p style="text-align: center;">／／たった30記事で稼いだ実録記事（2,980円相当）付き!＼＼</p>
<p>※ヘッダーの画像は、写真ACとイラストACのイラストレーターさん方の作品です。特典内でURLをお伝えしています。</p>
<p></div></div>

<h2>WordPress Lightningのカスタマイズ　5.　「トップページ PR Block」</h2>
<p>Lightningで一番目に付くのはTOPページのPRブロックではないでしょうか。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6673 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning11.jpg" alt="Lightning　PRブロック" width="600" height="298" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning11.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning11-300x149.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>この3つを構成していく部分がカスタマイズの「Lightning トップページ PR Block」です。PRブロックが必要ないと思えば、この欄の一番上、「PR Block を表示する」のチェックをはずします。</p>
<img loading="lazy" decoding="async" class="alignnone size-medium wp-image-6674" src="https://blognote01.com/wp-content/uploads/2019/12/litning17-300x194.jpg" alt="Lightning　PRブロック表示のさせ方" width="300" height="194" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning17-300x194.jpg 300w, https://blognote01.com/wp-content/uploads/2019/12/litning17.jpg 348w" sizes="(max-width: 300px) 100vw, 300px" />
<p>PRブロックは、左から1.2.3となっています。該当の番号の編集ができるようになっています。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6675 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning18.jpg" alt="Lightning　PRブロック設定詳細" width="600" height="313" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning18.jpg 600w, https://blognote01.com/wp-content/uploads/2019/12/litning18-300x157.jpg 300w" sizes="(max-width: 600px) 100vw, 600px" />
<p>この場所で編集できることは以下のとおり。</p>
<ul>
<li>アイコン</li>
<li>タイトル</li>
<li>サブテキスト</li>
<li>リンクURL</li>
</ul>
<p>&nbsp;</p>
<h2>WordPress Lightningのカスタマイズ　6.  「プロフィール」</h2>
<p>個人のブログでも、企業の運営者情報でもプロフィールがきちんとできていると信頼感がでてきます。Lightningのプラグイン「VK All in One Expansion Unit (Free)」で使いやすいプロフィールができます。</p>
<h3>プロフィールの作り方</h3>
<p>まずはプラグインの設定を確認します。</p>
<p><span style="background-color: #ffc6d1;">▼　ダッシュボード　⇒　VK ExUnit</span></p>
<p>この画面のウィジェットにチェックが入っているか確認します。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6681 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning19.jpg" alt="Lightningのプロフィールウィジェット" width="500" height="294" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning19.jpg 500w, https://blognote01.com/wp-content/uploads/2019/12/litning19-300x176.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" />
<p>次にウィジェットでプロフィールを追加します。</p>
<p><span style="background-color: #ffc6d1;">▼　ダッシュボード　⇒　外観　⇒　ウィジェット</span></p>
<p>VKプロフィールという部分を配置したい場所（右側）に追加します。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6683 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning21.jpg" alt="Lightningのプロフィールウィジェット操作" width="400" height="263" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning21.jpg 400w, https://blognote01.com/wp-content/uploads/2019/12/litning21-300x197.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" />
<p>するとプロフィールを作る場所が開きますので設定をしていきます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6682" src="https://blognote01.com/wp-content/uploads/2019/12/litning20jpg.jpg" alt="Lightningのプロフィール内容記載" width="300" height="424" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning20jpg.jpg 425w, https://blognote01.com/wp-content/uploads/2019/12/litning20jpg-212x300.jpg 212w" sizes="(max-width: 300px) 100vw, 300px" />
<ul>
<li>タイトル</li>
<li>プロフィール用画像を選択</li>
<li>プロフィールテキスト</li>
<li>SNSリンク先のURL</li>
<li>アイコン背景</li>
<li>アイコンの色</li>
</ul>
<p>以上の編集ができます。</p>
<p>設定をすると以下のようなプロフィールを作ることができます。場所もサイドバーだけではなくフッターやトップなど調整ができます。</p>
<img loading="lazy" decoding="async" class="alignnone wp-image-6684 size-full" src="https://blognote01.com/wp-content/uploads/2019/12/litning22.jpg" alt="Lightningのプロフィール完成" width="400" height="215" srcset="https://blognote01.com/wp-content/uploads/2019/12/litning22.jpg 400w, https://blognote01.com/wp-content/uploads/2019/12/litning22-300x161.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" />
<p>&nbsp;</p>
<p>&nbsp;</p>
<h2>初心者だからこそWordpress有料テーマ を使うべき理由</h2>
<div class="cbox is-style-yellow_box type_normal"><div class="cboxcomment"><br />
<span style="font-size: 12pt;"><strong>無料テーマを使うことで時間の無駄遣いをしていませんか？</strong></span></p>
<ul>
<li>思い通りのデザインにできない・・・</li>
<li>なかなか稼げない・・・</li>
<li>アクセス数が増えない・・・</li>
</ul>
<p>こんな悩みを抱えていませんか？<br />
&nbsp;</p>
<p>稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。</p>
<p>&nbsp;</p>
<h3>Wordpressの有料テーマができる５つのこと</h3>
<ol>
<li>検索上位を目指せる</li>
<li>見た目が綺麗でおしゃれになる</li>
<li>機能が豊富で出来ることが多い</li>
<li>会員フォームなどのサポート</li>
<li>有名ブロガーも有料テーマを使っている</li>
</ol>
<p>&nbsp;</p>
<p>これまでにあげた5つの有料テーマの特徴を説明していきます。</p>
<h4>1.　検索上位を目指せる</h4>
<p>ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。</p>
<ul>
<li>情報の信頼性</li>
<li>ユーザーへの役立つ情報であるか？</li>
<li>スマホ・PCなどでストレスなく使える</li>
</ul>
<p>&nbsp;</p>
<p>などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。</p>
<p>&nbsp;</p>
<h4>2.　見た目が無料テーマ以上に綺麗になる</h4>
<p>シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。</p>
<p>有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。</p>
<p style="text-align: center;"><img loading="lazy" decoding="async" class="size-medium wp-image-9942 aligncenter" src="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg" alt="" width="300" height="218" srcset="https://blognote01.com/wp-content/uploads/2020/05/THOR222-300x218.jpg 300w, https://blognote01.com/wp-content/uploads/2020/05/THOR222.jpg 650w" sizes="(max-width: 300px) 100vw, 300px" />出典：THE THOR 着せ替え「01」</p>
<p style="text-align: center;"><strong>↓　クリックで拡大します</strong><br />
<a href="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3.jpg"><img loading="lazy" decoding="async" class="aligncenter wp-image-11133 size-medium" src="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg" alt="" width="300" height="169" srcset="https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-300x169.jpg 300w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1024x576.jpg 1024w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-768x432.jpg 768w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-1536x864.jpg 1536w, https://blognote01.com/wp-content/uploads/2020/07/全部で9種類-3-2048x1152.jpg 2048w" sizes="(max-width: 300px) 100vw, 300px" /></a>出典：<a href="https://blognote01.com/thethor-newarrange" target="_blank" rel="noopener noreferrer">特製THE THORオリジナルアレンジ</a></p>
<p>&nbsp;</p>
<h4>3.　機能が豊富でできることが多い</h4>
<p>今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。</p>
<h4>4.　会員フォーラムなどのサポート</h4>
<p>なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。</p>
<h4>5.　有名ブロガーも多数使用</h4>
<p>稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。</p>
<p>もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。</p>
<p>カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。</p>
<p><div class="cbox intitle is-style-pink_box type_normal"><div class="box_title"><span class="span__box_title">当ブログおすすめWordpressテーマ！</span></div><div class="cboxcomment"><br />
<img loading="lazy" decoding="async" src="https://blognote01.com/wp-content/uploads/2019/05/nigaoemaker-e1558864804973.png" alt="" width="96" height="96" class="alignnone  wp-image-1393" /><br />
<span style="font-size: 14pt;"><strong><a href="https://www.infotop.jp/click.php?aid=271209&amp;iid=79208&amp;pfg=1" rel="sponsored">WordPressテーマ「THE・THOR」</a></strong></span></p>
<ul>
<li>高機能の最新テーマで有名ブロガーも使用</li>
<li>着せ替え機能でいろんな用途に使える</li>
<li>複数のブログに使える（本人のブログ）</li>
<li>会員フォーラムやマニュアル完備</li>
</ul>
<p><div class="wp-block-button btn-wrap aligncenter big is-style-rich_pink"><a href="https://blognote01.com/thethor-tokuten" target="_blank" rel="noopener"class="wp-block-button__link" >THE THORの8大特典を見てみる！</a></div><br />
</div></div>
<br />
</div></div>

]]></content:encoded>
					
					<wfw:commentRss>https://blognote01.com/wordpress-ightningcustomiz/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">6658</post-id>	</item>
	</channel>
</rss>
