<?xml version="1.0" encoding="utf-8" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>オリジナルブログヘッダー販売♪　ハッピーデザインスタッフブログ♪</title>
<link>https://ameblo.jp/happydesign358/</link>
<atom:link href="https://rssblog.ameba.jp/happydesign358/rss20.xml" rel="self" type="application/rss+xml" />
<atom:link rel="hub" href="http://pubsubhubbub.appspot.com" />
<description>あなたのブログからハッピーを！</description>
<language>ja</language>
<item>
<title>【ブログ豆知識】カスタムしたアメブロヘッダーにリンクを貼る方法！</title>
<description>
<![CDATA[ <blockquote cite="http://design.willblestory358.com/?p=366"><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F11%2F%E3%83%8F%E3%82%99%E3%83%8A%E3%83%BC.png" alt="バナー" width="1094" height="607" class="alignnone size-full wp-image-367"><br><br>今日はカスタムしたアメブロヘッダーのヘッダー部分。<br>CSSカスタムでただ画像を貼るだけではリンクが飛びません！<br><br><a href="http://blog.ameba.jp/ucs/editcss/srvcssupdateinput.do">アメブロデザインCSSの編集</a><br><br>なぜなら<br>ヘッダー画像はヘッダーDIVの中の背景に配置されていて<br>画像として配置されていないからです。<br><br>その代わり簡単な作業でヘッダー画像をダウンロードされたりすることはありませんが。。。。<br><br>ここからホームのページへリンクが飛んでたら楽なのになあ。。。<br><br>そんな時！<br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F11%2F%E3%82%A2%E3%83%A1%E3%83%95%E3%82%99%E3%83%AD%EF%BD%9CAmeba__%E3%82%A2%E3%83%A1%E3%83%BC%E3%83%8F%E3%82%99_.png" alt="アメブロ｜Ameba__アメーバ_" width="982" class="alignnone size-full wp-image-370"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F11%2F%E7%AE%A1%E7%90%86%E3%83%88%E3%83%83%E3%83%95%E3%82%9A%EF%BD%9CAmeba__%E3%82%A2%E3%83%A1%E3%83%BC%E3%83%8F%E3%82%99_.png" alt="管理トップ｜Ameba__アメーバ_" width="1370" class="alignnone size-full wp-image-369"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F11%2F%E3%83%86%E3%82%99%E3%82%B5%E3%82%99%E3%82%A4%E3%83%B3%E3%81%AE%E5%A4%89%E6%9B%B4%EF%BD%9CAmeba__%E3%82%A2%E3%83%A1%E3%83%BC%E3%83%8F%E3%82%99_.png" alt="デザインの変更｜Ameba__アメーバ_" width="1370" class="alignnone size-full wp-image-368"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F11%2F%E3%83%95%E3%82%99%E3%83%AD%E3%82%AF%E3%82%99%E3%83%86%E3%82%99%E3%82%B5%E3%82%99%E3%82%A4%E3%83%B3%E3%81%AECSS%E3%81%AE%E7%B7%A8%E9%9B%86%EF%BD%9CAmeba__%E3%82%A2%E3%83%A1%E3%83%BC%E3%83%8F%E3%82%99_.png" alt="ブログデザインのCSSの編集｜Ameba__アメーバ_" width="1370" class="alignnone size-full wp-image-373"><br><br>現在使用中のブログデザインCSSの<br>いちばーーーん最後に<br><br>h1.skinTitleArea a{<br>width:ここにヘッダー画像の横サイズを入れる;<br>height:ここにヘッダー画像の縦サイズを入れる;<br>display:block;<br>position:absolute;<br>text-indent:-9999px;<br>}<br>h2.skinDescriptionArea{<br>display:none;<br>}<br>.skinHeaderArea2,.skinBlogHeadingGroupArea{<br>padding:0;<br>}<br><br>を入れてみてください☆<br><br>全部の文字が半角になっていることを確認してくださいね♪<br><br>以下ちょっと専門的なことを答え合わせします☆<br>ご興味のある方だけどうぞ！<br><br>h1.skinTitleArea a<br>というのがヘッダーに入るタイトル【リンクされている文字】<br>に当てられるスタイルと言う意味です。<br><br>本来　aって縦も横もないテキストの形に沿った形になるんだけど<br>これを入れることで実態がでます！<br>【display:block;】<br><br>そのサイズをヘッダー画像のサイズに合わせて<br><br>【width:ここにヘッダー画像の横サイズを入れる;<br>height:ここにヘッダー画像の縦サイズを入れる;】<br><br>【position:absolute;】<br>どこにでも飛んでいける位置情報のない子になります。<br><br>ので、<br>text-indent:-9999px;<br>ではるか彼方に飛ばして<br><br>文字は見えないけどリンクは残ってるという形なりました。<br><br>【h2.skinDescriptionArea{<br>display:none;<br>}】<br>これでブログの説明も見えなくなります～<br>ブログの説明を残したい場合はこれは省いてもOKです。<br><br><br><br><a href="http://design.willblestory358.com/" target="_blank">ハッピーなデザインはハッピーデザインまで♥</a></blockquote>
]]>
</description>
<link>https://ameblo.jp/happydesign358/entry-12090671590.html</link>
<pubDate>Sun, 01 Nov 2015 05:31:49 +0900</pubDate>
</item>
<item>
<title>大人気のオリジナル似顔絵入りヘッダー！</title>
<description>
<![CDATA[ <blockquote cite="http://design.willblestory358.com/?p=361"><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Fwbbanner_nigaoe.png" alt="wbbanner_nigaoe" class="alignnone size-full wp-image-49"><br><br>ハッピーデザイン専属のプロのイラストレーターが<br>3種類のテイストからあなたの似顔絵を作製します！<br><br>バナーとセット価格で　イラスト一枚　1万円<br>名刺やプロフィール写真にも使用していただけます＾＾<br><br>どことなく、いや、確かにそっくりだ！<br><br>とイラストレーターの方にオーダーする私たちも<br>ラフが上がるたびに、驚きと喜びの連続です～<br><br><strong>プロフィール写真を実物の写真にするのはちょっと、、、、<br>でもどうしたらいいの？</strong><br><br>という方にも大好評です♪<br><br>作例はこちら♪<br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Fjisseki_03nunonapuobachan.jpg" alt="jisseki_03nunonapuobachan" width="250" height="253" class="alignnone size-full wp-image-36"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Fjisseki_06naturallife.jpg" alt="jisseki_06naturallife" width="250" height="253" class="alignnone size-full wp-image-39"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Fjisseki_04earthharmony.jpg" alt="jisseki_04earthharmony" width="250" height="253" class="alignnone size-full wp-image-37"><br><br><img src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Fjisseki_10fukuyama.jpg" alt="jisseki_10fukuyama" width="250" height="253" class="alignnone size-full wp-image-88"><br><br><br><br><a href="http://design.willblestory358.com/" target="_blank">ハッピーなデザインはハッピーデザインまで♥</a></blockquote>
]]>
</description>
<link>https://ameblo.jp/happydesign358/entry-12089876815.html</link>
<pubDate>Fri, 30 Oct 2015 01:51:40 +0900</pubDate>
</item>
<item>
<title>簡単アメブロのヘッダー画像の設定方法</title>
<description>
<![CDATA[ <blockquote cite="http://design.willblestory358.com/?p=136"><div class="header_change" style="text-align: center;">アメブロのヘッダー画像の設定方法をご紹介します。<br><br><h3>マイページから『アメブロ』をクリックブログ管理画面へ</h3>    <img class="alignnone size-full wp-image-188 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2F01banner_change.png" alt="01banner_change" style="width:100%; height:auto; height:auto;"><br><br>    <img class="alignnone size-full wp-image-100" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" width="93" height="95"><br><br><h3>ブログ管理画面から『デザインの変更』をクリック</h3>    <img class="alignnone size-full wp-image-189 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>デザインの変更画面のテンプレート『カスタム可能』をクリック</h3>    <img class="alignnone size-full wp-image-190 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>テンプレートの中からバナーに合いそうなデザインを選ぶ</h3>    <img class="alignnone size-full wp-image-191 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto;/>&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>ブログのレイアウト『カラム』を選択後、<br>        『確認画面を閉じる』をクリック</h3>    <img class="alignnone size-full wp-image-192 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />    ブログデザインの適用が完了します&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>『デザインを簡単カスタマイズする』をクリック</h3>    <img class="alignnone size-full wp-image-193 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>ヘッダー『オリジナル画像を使う』をクリック</h3>    <img class="alignnone size-full wp-image-194 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>『選択』をクリック　使用画像を選択し、　『アップロード』をクリック</h3>    <img class="alignnone size-full wp-image-195 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>アップロードされた画像をクリック</h3>    <img class="alignnone size-full wp-image-197 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>画像が適用された事を確認したら『×』でウィンドウを閉じる</h3>    デフォルトでは画像は切れた状態で入ります。<br>    <img class="alignnone size-full wp-image-198 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto;/>&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>『画像の高さ』を300px と『テキストのサイズ』を 小　にする</h3>    <img class="alignnone size-full wp-image-199 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2Farrow.png" alt="arrow" style="width:100%; height:auto; />&lt;br />&lt;br />    &lt;img class=" alignnone size-full wp-image-100" width="93" height="95"><br><br><h3>下のプレビューで画像の高さが300pxになったら『保存』をおす</h3>    <img class="alignnone size-full wp-image-200 line" src="https://img-proxy.blog-video.jp/images?url=http%3A%2F%2Fdesign.willblestory358.com%2Fwp-content%2Fuploads%2F2015%2F04%2F13banner_change.png" alt="13banner_change" style="width:100%; height:auto; />&lt;br />&lt;br />バナーの適応終了です！！&lt;br />&lt;br />&lt;/div>&lt;br />&lt;a href=" http: design.willblestory358.com target="_blank">ハッピーなデザインはハッピーデザインまで♥<br></div></blockquote>
]]>
</description>
<link>https://ameblo.jp/happydesign358/entry-12030959653.html</link>
<pubDate>Thu, 09 Apr 2015 20:38:51 +0900</pubDate>
</item>
</channel>
</rss>
