テーマの投稿スタイルです。
HTMLやCSSを知らなくても、いつも通り記事を投稿するだけであなたのWordPressが素敵なデザインに。
テーマの雰囲気をきちんと感じて頂くために、このデモサイトではプラグインなどは利用していません。
Responsive-images [ レスポンシブイメージ ]
画面サイズが変わっても画像の端が切れることなくレスポンシブに表示されます。

Headings [ 見出し ]
マテリアルデザイン WordPress <h1>
マテリアルデザイン WordPress <h2>
マテリアルデザイン WordPress <h3>
マテリアルデザイン WordPress <h4>
マテリアルデザイン WordPress <h5>
マテリアルデザイン WordPress <h6>
マテリアルデザイン WordPress <h1>
マテリアルデザイン WordPress <h2>
マテリアルデザイン WordPress <h3>
マテリアルデザイン WordPress <h4>
マテリアルデザイン WordPress <h5>
マテリアルデザイン WordPress <h6>
Paragraph [ 段落 ]
町の上に高く柱がそびえ、その上に幸福の王子の像が立っていました。 王子の像は全体を薄い純金で覆われ、 目は二つの輝くサファイアで、 王子の剣のつかには大きな赤いルビーが光っていました。王子は皆の自慢でした。 「風見鶏と同じくらいに美しい」と、 芸術的なセンスがあるという評判を得たがっている一人の市会議員が言いました。 「もっとも風見鶏ほど便利じゃないがね」と付け加えて言いました。
これは夢想家だと思われないように、と心配したからです。 実際には彼は夢想家なんかじゃなかったのですが。
「どうしてあの幸福の王子みたいにちゃんとできないの」 月が欲しいと泣いている幼い男の子に、賢明なお母さんが聞きました。 「幸福の王子は決して何かを欲しがって泣いたりしないのよ」
オスカー・ワイルド『幸福の王子』 結城浩訳
Give me your pardon, sir: I’ve done you wrong; But pardon’t, as you are a gentleman. This presence knows, And you must needs have heard, how I am punish’d With sore distraction.
What I have done, That might your nature, honour and exception Roughly awake, I here proclaim was madness. Was’t Hamlet wrong’d Laertes? Never Hamlet:
If Hamlet from himself be ta’en away, And when he’s not himself does wrong Laertes, Then Hamlet does it not, Hamlet denies it. Who does it, then? His madness: if’t be so,
Hamlet is of the faction that is wrong’d; His madness is poor Hamlet’s enemy. Sir, in this audience, Let my disclaiming from a purposed evil Free me so far in your most generous thoughts,
That I have shot mine arrow o’er the house, And hurt my brother.
Shakespeare, Hamlet: Act 5, Scene 2
Blockquote [ 引用 ]
「僕はピラミッドに出発するよ。じゃあね」
レスポンシブWebデザイン 【responsive web design】
Webデザインの手法の一つで、様々な種類の機器や画面サイズに単一のファイルで対応すること。
(中略)
表示された機器の種類やサイズに応じて表示内容が最適な状態に変化するよう設定された単一のファイルを制作し、すべての機器に同じように送信する。
(後略)
IT用語辞典 e-Words
List [ リスト ]
Table [ テーブル ]
Album | Price | Release Date |
---|---|---|
Girls Voice Studio 11 | 3,146 | 2002.3.6 |
Roots | 3,146 | 2000.6.21 |
Next Lounge | 1,258 | 2000.5.17 |
Album | Price | Release Date |
---|---|---|
Girls Voice Studio 11 | 3,146 | 2002.3.6 |
Roots | 3,146 | 2000.6.21 |
Next Lounge | 1,258 | 2000.5.17 |
Album | Price | Release Date |
---|---|---|
Girls Voice Studio 11 | 3,146 | 2002.3.6 |
Roots | 3,146 | 2000.6.21 |
Next Lounge | 1,258 | 2000.5.17 |
Album | Price | Release Date |
---|---|---|
Girls Voice Studio 11 | 3,146 | 2002.3.6 |
Roots | 3,146 | 2000.6.21 |
Next Lounge | 1,258 | 2000.5.17 |
Code [ プログラムコード ]
$("#trigger").click(function(){
<ul class="collection with-header">
<li class="collection-header"><h4>First Names</h4></li>
<li class="collection-item"><div>Alvin<a href="#!" class="secondary-content"><i class="mdi-content-send"></i></a></div></li><i class="mdi-content-send"></i></a></div></li>
<li class="collection-item"><div>Alvin<a href="#!" class="secondary-content"><i class="mdi-content-send"></i></a></div></li>
<li class="collection-item"><div>Alvin<a href="#!" class="secondary-content"><i class="mdi-content-send"></i></a></div></li>
<li class="collection-item"><div>Alvin<a href="#!" class="secondary-content"><i class="mdi-content-send"></i></a></div></li>
</ul>
Style Components [ スタイルコンポーネント ]
投稿画面のドロップダウンからショートコードを選ぶだけで簡単に利用できるテーマの拡張スタイルや便利なコンポーネントです。
便利なワードプレスを【Esperanza】テーマでさらにおしゃれに使いこなしましょう。
Fonts [ フォント ]
Fonts : [ Google Fonts ]
License: CC BY 3.0
Vollkorn
Boy meets girl.
Tangerine
Make my day.
Damion
I love you.
Cinzel
TIME
Source Code Pro
sw = new System.IO.StreamWriter(fpath, false, enc);
for (int i = 0; i >= dt.Length – 1; i++)
Font size [ フォントサイズ ]
Font color [ フォントカラー ]
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
「君を好きになってもいいかい」とツバメは言いました。『幸福な王子』オスカー・ワイルド
Icons [ アイコン ]
Icons : [ Font Awesome ]
License: SIL OFL 1.1
WordPressテーマ【Esperanza】にはアイコンWebフォントを採用しているので、
ような楽しくて美しいアイコンを利用できます。
CSSで読み込んでいるためサイズや色も簡単に変更可能です。
Images [ イメージ ]
Photo-like effect [ 写真風エフェクト ]
Retouch [ 色調補正 ] 一部のブラウザは対応していません。ご利用の際にはご注意下さい。
Lightbox [ ライトボックス ]
Plugin : [ Boxer ]
License: MIT Licence
画像をクリックすると拡大して表示されます。
Responsive-video [ レスポンシブ埋め込み動画 ]
Youtubeの動画などを埋め込む際に画面サイズに応じてレスポンシブに表示されます。
Panels [ パネル ]
Text Panel [ テキストパネル ]
Photo Panel [ フォトパネル ]

愛は目ではなく、心で見るもの。
だから翼の天使キューピッドは盲目に描かれる。
マテリアルデザインの素敵なボタンを用途に応じて使い分けることが可能です。
Dropdown [ ドロップダウン ]
動きのあるマテリアルデザインのドロップダウンメニューです。
Modal [ モーダルウィンドウ ]
デザイン性のある子ウィンドウをモーダル表示できます。
Tooltip [ ツールチップ ]
注釈やヒント、コメントなどを表示するのに便利なツールチップです。
Accordion [ アコーディオン ]
開閉できるアコーディオンでコンテンツを見やすく表示できます。
- フレデリック・ショパン Fryderyk Franciszek Chopin
フレデリック・フランソワ・ショパンは、ポーランドの前期ロマン派音楽を代表する作曲家である。当時のヨーロッパにおいてもピアニストとして、また作曲家として有名であった。その作曲のほとんどをピアノ独奏曲が占め、ピアノの詩人とも呼ばれるように、様々な形式、美しい旋律、半音階的和声法などによってピアノの表現様式を拡大し、ピアノ音楽の新しい地平を切り開いた。ノクターンやワルツなど、今日でも彼の作曲したピアノ曲はクラシック音楽ファン以外にもよく知られており、ピアノの演奏会において取り上げられることが最も多い作曲家の一人でもある。また、強いポーランドへの愛国心からフランスの作曲家としての側面が強調されることは少ないが、父の出身地で主要な活躍地であった同国の音楽史に占める重要性も無視できない。(出典:ウィキペディア)
- フランツ・リスト Franz Liszt
フランツ・リストは、ハンガリーに生まれ、ドイツやオーストリアなどヨーロッパ各国で活躍したピアニスト・作曲家。両親の血統、母語、もっとも長い活躍地のいずれもドイツに属し、当時中東欧に多数存在したドイツ植民の一人だが、自身生地のハンガリー(当時はオーストリア支配下の形式的独立国としてのハンガリー王国の版図内、現在はオーストリアに帰属している)を祖国と呼び、死後もドイツ人(オーストリア人)よりはハンガリー人と記載されることが多い。ただし、こうした出自や、生涯ハンガリー語を習得することがなかったこともあり、非音楽大国系の民族運動としての国民楽派に含めることは殆どなく、多くはドイツロマン派の中に位置づけられる。(出典:ウィキペディア)
- アルトゥール・ルービンシュタイン Arthur Rubinstein
アルトゥール・ルービンシュタインは、ポーランド出身のピアニスト。様々な作曲家の作品の演奏で国際的な名声を博し、特にショパンの演奏では同時代の最も優れたピアニストであるとみなされている。また、20世紀の代表的なピアニストの1人である。ルービンシュタインの演奏家としてのキャリアは80年にも及んだ。前半生はヨーロッパで、後半生はアメリカ合衆国で活躍した。ショパン以外では、ブラームスやスペインのピアノ音楽も得意とした。(出典:ウィキペディア)
Progress bars [ プログレスバー ]
進捗状態などを表すプログレスバーを表示できます。
QR Code [ QRコード ]
便利なQRコードもプラグインを使わずに簡単に設置することができます。
Tabs [ タブ ]
ページ遷移なく同一ページ内でコンテンツを切り替えることができます。
2カラム【 レイアウト:2カラム 】
記事内のお好きな位置に2カラムレイアウトのボックスを設置することができます。
* 範囲を分かりやすくするためにグレーの点線の枠を設けていますが、実際にショートコードをご利用頂く際には枠は表示されません。
* レスポンシブデザインに対応しており、PCでは2カラム、スマホ/タブレットでは1カラムになります。

左カラム

右カラム
3カラム【 レイアウト:3カラム 】
記事内のお好きな位置に3カラムレイアウトのボックスを設置することができます。
* 範囲を分かりやすくするためにグレーの点線の枠を設けていますが、実際にショートコードをご利用頂く際には枠は表示されません。
* レスポンシブデザインに対応しており、PCでは3カラム、スマホ/タブレットでは1カラムになります。

左カラム

中央カラム

右カラム
4カラム【 レイアウト:4カラム 】
記事内のお好きな位置に4カラムレイアウトのボックスを設置することができます。
* 範囲を分かりやすくするためにグレーの点線の枠を設けていますが、実際にショートコードをご利用頂く際には枠は表示されません。
* レスポンシブデザインに対応しており、PCでは4カラム、スマホ/タブレットでは2カラムになります。

最左カラム

中央カラム

中央カラム

最右カラム