クールでかっこいいWPテーマ Ver.16 > テーマの機能 > 投稿ページの表示サンプルです!
Release: 2018/12/17 Update: 2019/02/28

投稿ページの表示サンプルです!

見出し文字

サンプル文字 <h2 class=”idx01 red”> 〜 </h2>

サンプル文字 <h3 class=”idx02 blue”> 〜 </h3>

サンプル文字 <h4 class=”idx03 purple”> 〜 </h4>

サンプル文字 <h5 class=”idx04 pink”> 〜 </h5>
サンプル文字 <h6 class=”idx01 green”> 〜 </h6>

 
 

文章サンプル

 

レンタルサーバーについて

Rental Serverはホームページやブログを開設する時に利用するものですが、どのような観点で選んでいるのでしょうか。
Rental Serverには幾つかの種類があり、それらを比較することが重要、もちろん、価格の比較も重要です。しかし、Rental Serverを利用する目的を明確にして、その目的に合ったサーバーを選ぶことが大切です。
サーバーの利用形態で比較すると共用サーバーと専用サーバーがあります。つまり、一つのハードを複数の利用者で共用するか、一人の専用とするかと言うことです。当然ながら、専用サーバーは高価ですが、他人のプログラムの影響を受けることがありませんから、安定した動作が期待できます。
会社が業務として運用する場合には専用サーバーとした方がいいでしょうが、個人での利用は共用サーバーが一般的です。ハード的には共用サーバーであっても、論理的に複数のサーバーに見せる技術があります。
それがVPSと呼ばれるサービスです。 ← strongタグで囲んでいます。
これは一般の共用サーバーとは異なり、ユーザーから見ると専用サーバーに見えるのです。したがって、OSの入れ替えのような変更でも可能です。提供されるサービスは業者によって異なります。もちろん、サーバーの種類によってもできる範囲が異なっています。
個人の場合はブログやホームページくらいでしょうか。個人経営のOnline Sshopもあるかもしれません。これらは標準的なサービスとなっています。

 
 

テーブルサンプル

 

商品名 商品01 商品02 商品03 商品04
価 格 6,000円(税別) 6,000円(税別) 6,000円(税別) 6,000円(税別)
特 長 商品の特徴を記入します。 商品の特徴を記入します。 商品の特徴を記入します。 商品の特徴を記入します。
備 考 国内送料無料 国内送料無料 国内送料無料 国内送料無料
※スマホ表示ではスライドします。

 
 

リスト表示

<ul><ol> のサンプルです。

  • リスト表示のサンプルです。
  • リスト表示のサンプルです。
  • リスト表示のサンプルです。
  1. 番号付きリスト表示のサンプルです。
  2. 番号付きリスト表示のサンプルです。
  3. 番号付きリスト表示のサンプルです。

 
 

マーク

<mark> 〜 </mark> で下記のようにハイライトされます。
サーバーの利用形態で比較すると共用サーバーと専用サーバーがあります。つまり、一つのハードを複数の利用者で共用するか、一人の専用とするかと言うことです。当然ながら、専用サーバーは高価ですが、他人のプログラムの影響を受けることがありませんから、安定した動作が期待できます。

 
 

チェック画像付きリスト表示

 
下記のように記述します(文字も大きく表示させています。)

<!-- チェック画像付きリスト表示 -->

<div class="framed-text purple">
<div class="framed-title purple">囲み枠の中に表示させています!</div>
<ul class="check" style="font-size:1.25em;">
 <li class="red"><strong>チェック付きリスト表示のサンプルです。</strong></li>

 〜

</ul>
</div>
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。
  • チェック付きリスト表示のサンプルです。

 
 

囲み枠付きテキスト

<div class=”framed-text”> 〜 </div> でテキストを枠付き(ボックス囲み)で表示します。

テキストを枠付きで表示します。強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。

 
 

タイトル付き囲み枠テキスト

<div class=”framed-title”> 〜 </div> を枠内に追加すれば、タイトル付き囲み枠になります。

<!-- タイトル付き囲み枠テキスト -->

<div class="framed-text blue">
<div class="framed-title blue">囲み枠の特長</div>

〜

</div>

 

囲み枠の特長

テキストをタイトル付き枠で表示します。強調する文章等に利用できます。テキストをタイトル付き枠で表示します。強調する文章等に利用できます。

表示のサンプル <h6 class=”idx09 red”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 blue”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 green”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 pink”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 brown”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 purple”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 grey”> 〜 </h6> で指定しています。

 
 

吹き出し

 

一郎

こんな感じの吹き出しになります。
吹き出しには、人物や動物の画像を利用できます。利用する画像は管理画面の「カスタマイザー」で事前に登録しておきます。


美咲

吹き出しについては、下記のページを参考にしてください。
https://www.af-partner.net/wpv16/1650/theme-functions/30/


 
 

引用サンプル

 

Rental Serverはホームページやブログを開設する時に利用するものですが、どのような観点で選んでいるのでしょうか。
Rental Serverには幾つかの種類があり、それらを比較することが重要、もちろん、価格の比較も重要です。しかし、Rental Serverを利用する目的を明確にして、その目的に合ったサーバーを選ぶことが大切です。

 
 

YouTube埋め込み

<div class=”youtube”> 〜 </div> でマークすると、レスポンシブ対応になります。

 
 

インスタグラム埋め込み

センタリングは <div class=”insta-center”> インスタグラムの埋め込みコード </div> と設定します。
なお、サイズは style.css の「.insta-center」の値を変更します。

 

 
 

ツイッター埋め込み

センタリングは <div class=”insta-center”> ツイッターの埋め込みコード </div> を利用しました。
 

 

HOME



コメントはお気軽にどうぞ

メールアドレスは公開されません。
また、* が付いている欄は必須項目ですので、必ずご記入をお願いします。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

CAPTCHA