Blogger SVGアイコン26種類 /responsive/sprite_v1_6.css.svg

qooq_customize_360.png

<style>

.svg-icon-36 {
width: 36px;
height: 36px;
fill: white; /* Can edit color */
background: orange; /* Can edit color */
padding: 5px;
}


</style>


 (注)投稿記事内のみ有効な CSS記述は、 styleタグ で囲む必要があります 




 Google Blogger ブログの "全テンプレート(テーマ)" で利用可能な「SVGアイコン26種類」を まとめました!
 /responsive/sprite_v1_6.css.svg#[SVGアイコン名] にて呼び出せますよー。






<p>
 <svg class="svg-icon-36"><use xlink:href='/responsive/sprite_v1_6.css.svg#ic_24_email_dark' xmlns:xlink='//www.w3.org/1999/xlink'></use></svg>
</p>

 インラインstyleでは、CSSのマークアップを所定のタグに style属性で 追加する。

<svg style="fill:#ff0000;width:36px;height:36px"><use href='/responsive/sprite_v1_6.css.svg#ic_share_black_24dp'/></svg>



 Google Blogger ブログにて、デフォルトで利用可能なSVGアイコン 26種類 


[01]  #ic_24_email_dark

[02]  #ic_24_facebook_dark

[03]  #ic_24_googlePlus_dark

[04]  #ic_24_link_dark

[05]  #ic_24_pinterest_dark

[06]  #ic_24_twitter_dark

[07]  #ic_add_box_black_24dp

[08]  #ic_arrow_back_black_24dp

[09]  #ic_arrow_forward_black_24dp

[10]  #ic_chat_bubble_black_24dp

[11]  #ic_check_box_black_24dp

[12]  #ic_check_box_outline_blank_black_24dp

[13]  #ic_chevron_left_black_24dp

[14]  #ic_chevron_right_black_24dp

[15]  #ic_close_black_24dp

[16]  #ic_expand_less_black_24dp

[17]  #ic_expand_more_black_24dp

[18]  #ic_menu_black_24dp

[19]  #ic_mode_comment_black_24dp

[20]  #ic_more_horiz_black_24dp

[21]  #ic_more_vert_black_24dp

[22]  #ic_person_black_24dp

[23]  #ic_post_blogger_black_24dp

[24]  #ic_rss_feed_black_24dp

[25]  #ic_search_black_24dp

[26]  #ic_share_black_24dp



 ↓ Google Bloggerブログ、投稿記事内で h1タグを記述したら "Bing Webmaster Tools" で「h1タグ 重複エラー」と表示されたので、以下画像に置き換え!
 まあ、「タイトル」に正しく h1タグが自動付加されてるということやね... ただ、"Safari Webインスペクタ" で生成HTMLを確認したら、JetThemeテンプレでは h1タグのみで strongタグは適用無し でした。


 「タイトル」に h1タグが自動適用(strongタグ同時適用もあり!)されるブログでは、通常 投稿(記事)本文では h2以下 の見出しタグを利用します!
 SEO的には h1h3 (h4) の見出しタグが最重要で、次に strong(強調)b(太字)タグが重要です。
 なお、strong(強調)タグで囲まれた箇所(この行の太字で表示された箇所)は、ほとんどのブラウザでは 太字(Bold)にて表示されるようです。



★★★ h2 表示テスト あいうえお かきくけこ ABCDEFG ★★★



★★★ h3 表示テスト あいうえお かきくけこ ABCDEFG ★★★



★★★ h4 表示テスト あいうえお かきくけこ ABCDEFG ★★★



★★★ h5 表示テスト あいうえお かきくけこ ABCDEFG ★★★


★★★ h6 表示テスト あいうえお かきくけこ ABCDEFG ★★★


 pタグ(段落の作成) サンプル 

 pタグ1(段落1)今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。

 pタグ2(段落2)今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。

 pタグ3(段落3)今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。今日も元気だ、卵がうまい。



パラ初期値説明
[selector] 文字列 '[type="deferjs"]' 遅延ロード対象の <script> 要素を指定する、 CSSセレクタ
初期値は「type属性が"deferjs"で完全一致」
[delay] 数値 0 対象 <script> 要素が実行されるまでの、待ち時間(ミリ秒単位)
[waitForUserAction] 真偽 false ユーザーとの対話があるまで、Defer.all() メソッドが 対象 <script> 要素の実行を待つかどうか?




Macブログ ランキング アイコン
最後まで読んでいただき、ありがとうございます。 また、お越しくださいませ。
// アタル
For follow LINE Reader Group!Subscribe to this blog on Feedly!

Next Post Previous Post
No Comment
Add Comment
comment url