ねこピアス

こんばんは！
そして、みなさんお久しぶりです～＞＜
いや～、こんなにブログ休んじゃったのも久しぶりというか…
初めてかもしれませんね！(´Д｀；)

おさぼりしてしまったのが半分、もう半分はちょっとMy Note*
の今後について考えることがあったからって感じです。
と言っても、別に悪い話ではないんですけどね！
これからどうしていこうかなーという希望の話です・ω・

さて、すっかりご無沙汰になってしまったこともあり、
先ほど新しく商品を１点UPいたしました
まだtetoteにしか出していませんが、これから他のサイトにも
出品していくつもりです☆

ということで、紹介をどうぞ（‐＾▽＾‐）


作品名：猫ピアス
クリエイター：アクセサリー作家 My Note*
作品価格：900円
作品説明：
【作品の特徴】
猫チャームとパールビーズを使ったピアスです。
立体的な猫チャームが特徴で、どの位置から見ても可愛いです♪♪
【利用シーン、利用方法】
普段のお洒落に最適なピアスです。
【サイズ等の仕様】
猫チャーム：1.5cm×1.7cm
【作品に込めた想い】
猫が大好きだけど、あまり派手なのは着けられない…
という方でも着けられるような、落ち着いた感じのピアスを
目指しました。
【オーダーメイドに関する説明と可否】
★ピアスからイヤリングへ金具変更いたいます。
※金具交換代として、商品価格にプラスして50円が別途かかります。
どうかご了承ください。
※イヤリングは基本的にバネ式のものを使用しております。
※作品の構造上、金具交換ができない物もありますので、どうか
ご理解ください。
★ピアスの種類変更いたします。
※つりがね式→キャッチ付、キャッチ付き→つりがね式　など
※ピアスからピアスへの交換は無料です。
※作品の構造上、金具交換ができない物もありますので、どうか
ご理解ください。

作品の詳細をtetoteで見る

実はこれと同じ種類のパーツで、違うポーズの猫ちゃんが
いるんですよね！
そちらも同じようにピアスにしましたので、早いうちにUPしたいと
思います。

ハンドメイド・手作りマーケット tetote（テトテ）
【応募受付中】日本最大級のハンドメイドアワード (2月28日〆切)

背景画像を敷く方法と記事背景を半透明にする方法

こんばんは！
前回のブログから数日経ってしまいましたね。

まだブログの改装は終わっていないのですが、ちょーっとずつ
じっくり前の状態へ、いや前よりもパワーアップした
ブログデザインへ変更しております・ω・

本当は次はタイトル画像を入れようかと思ったのですが、
画像を上に入れると、記事が下に下がって見にくくなってしまうので
ちょっと考え中…。

ということで、今日は
「背景画像を敷く方法」と
「記事背景を半透明にする方法」を
メモしておこうかと思います

まず、今回私が参考にしたのは「CSS勉強中スタッフのブログ」
というもので、アメブロのスタッフさんのブログです☆

こちらのブログは、「ブログ管理」の「デザインの変更」
にある「CSSの編集」をクリックします。

すると、上の方に「CSS勉強中のスタッフのブログ」
というのがあると思いますので、そこをクリック。
するとブログへたどり着きます（‐＾▽＾‐）


ブログには基本的なCSSのカスタマイズの方法が書いて
ありますので、とっても便利です。

で、今回私が使ったのは背景画像と背景を半透明にする方法
なので、そこをかいつまんでメモしておきますね！


ブログを見ていただければ分かるかと思いますが、
My Note*ブログでは背景にリボンの画像を使用しております。

まず、CSSの
・・・・・・・・・・・・・・・・・・・・・

/* (3-1) ボディ（全体）
--------------------------------------------*/

・・・・・・・・・・・・・・・・・・・・・
を探します。
そしてその下のところを…

・・・・・・・・・・・・・・・・・・・・・

.skinBody{
background:url(ここに画像のパスをいれてね);
}

・・・・・・・・・・・・・・・・・・・・・
と変更します。
画像を予めアップしておかないとパスが入れられませんので、
そこは注意してくださいね☆

で、ここまですると背景に画像が入るのですが、
記事の背景は別物なので、このままだと記事部分の背景は
真っ白のままです。
もともとリボン画像は薄い色合いなので、半透明にしても
あまり見えないのですが…まあ気休め程度にやってみました(笑)

半透明にする場合は、まずここを探します。
・・・・・・・・・・・・・・・・・・・・・

/* (3-6) 記事
--------------------------------------------*/

・・・・・・・・・・・・・・・・・・・・・

その下の辺りをですね～、
・・・・・・・・・・・・・・・・・・・・・

.skinArticle{
border:0;
background:url(http://stat100.ameba.jp/common_style/img/skin/cmn/bg/transparent/transparent_fff_8.png);
}

・・・・・・・・・・・・・・・・・・・・・
と変更します。
私の場合は白の半透明にしたかったのでこのURLを使用しましたが、
黒の半透明にもできるようですね！
その場合はURLが違ってくるようですので、それはスタッフブロフを
見て下さいませ。


よし、これでもう忘れないぞ！(笑)

ブログタイトルと説明を消す方法

こんばんは！
いや～、いつもブログを見てくださる方にはお分かりかと思いますが、ただ今ブログのレイアウトを改装中でございます。
といってもですね、最初はただ興味本意でちょこっと改装しようかな～と、「デザインの変更」で「レイアウトの変更」をしたところ…


なんと！！！


今までのCSSのカスタム内容が消えちゃった∑(ﾟДﾟ)


いやーん、今までの苦労が水の泡(泣)

それでなくてもPCに詳しくない私が、色々調べて今の体裁にしたっていうのに…
もうどうやってやったか忘れちゃったよ～(ノ◇≦。)

と嘆いていたのですが、いつまでもくよくよしたって始まらない！


ということで、また一からやり直したいと思います＞＜

そして、今度こそやり方を忘れないためにも、ブログの記事にしておくことに決めました！
あくまでも自分のために記事を書いているので面白くはないと思いますが、もし自分もCSSをいじってみたいという方がいらっしゃいましたらどうか参考にしてくださいませ。
※私のカスタムのやり方が正しくない場合もありますし、人によっては反映されない場合がございますので、そこはどうかご了承ください。


てことで、とりあえず今日は「ブログタイトルと説明を消す方法」をメモしときますね！

アメブロのヘッダーにオリジナルの画像を入れたい時に、タイトルと説明があると邪魔ですよね。
てことで、CSSに書き足して非表示にさせます。

こちらのコードをCSSの最後に追加させてくださいませ。・ω・
↓↓
・・・・・・・・・・・・・・・・・・・・・・・・・・
/* ブログタイトルとブログ説明文を消す */
#header h1,.skinTitleArea{ /* ブログタイトルを消す */
  display:none;
}
#header h2,.skinDescriptionArea{ /* ブログ説明文を消す */
  display:none;
}
・・・・・・・・・・・・・・・・・・・・・・・・・・

新旧両デザインのものなので、多分反映されると思います。

本当はこの後に「My Note」ってロゴの画像を入れようかと思ったのですが、なぜか上手く行かず…。
仕方がないのでそれはまた明日がんばろうと思います＞＜