スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

各種SNSボタンを横並びに設置する方法と注意点

ブログに「はてブボタン」「ツイートボタン」「いいね!ボタン」など、各種SNSボタン横並びに設置する方法と注意点です。
FC2ブログ用の、コピペで使えるソースも書いておきます。

ボタンの作り方は、過去記事の「ブログの記事ごとに『はてブ』(はてなブックマーク)ボタンを設置する方法」「ツイートボタン(Twitter公式)をブログに設置する方法」「Facebook『いいね!』ボタンの作成と設置(FC2ブログ)」をご覧下さい。
上記ボタン意外も設置出来ますが、今回はこの3点で説明して行きます。
バックアップを取ってから追記する事をお奨めします。


◆ 各種SNSボタンを横並びにする為のhtmlソース


<div class="sns_button">
<ul>
<li><a href="http://b.hatena.ne.jp/entry/<%topentry_link>" class="hatena-bookmark-button" data-hatena-bookmark-title="<%topentry_title>" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script></li>
<li><iframe src="//www.facebook.com/plugins/like.php?href=<%topentry_enc_link>&amp;send=false&amp;layout=button_count&amp;width= 110 &amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width: 110px ; height:21px;" allowTransparency="true"></iframe></li>
<li><a href="https://twitter.com/share" class="twitter-share-button" data-url="<%topentry_link>" data-text="<%topentry_title>" data-count="horizontal" data-lang="ja">ツイート</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></li>
</ul>
</div>

class名はお好みで変更しても構いません(変更する場合は、CSSのclass名も変更して下さい)。
<li>~</li>間が、各種ボタンのソースコードです(ボタンを追加する場合、ボタンのソースを<li></li>で括り、<ul>~</ul>間のお好きな位置に追記して下さい)。
FC2ブログをお使いの方で、各種ボタンの種類やサイズ、各記事の抽出情報がそのままで良ければコピペで使えます。
上から「はてブボタン」「いいね!ボタン」「ツイートボタン」ですが、「いいね!ボタン」の横幅(赤字部分)は御自身で調整された方が良いかもしれません(赤字の前後に半角スペースが入っているので御注意下さい)。
「ツイートボタン」のテキスト部分は、個別記事タイトルを抽出する様にしてあります(赤字部分)。
ブログタイトルも入れたい方は、過去記事のソース下をご覧下さい。
御自身のブログのhtmlソース内の<!--topentry--> ~ <!--/topentry-->間に貼付けて、CSSにて調整を行います。


◆ 各種SNSボタンを横並びにする為のCSSソース


/*--- SNSボタン ---*/

.sns_button li {
margin: 10px 5px 10px 0;
float: left;
display: inline;
}

CSSソース内の、一番下にでも追記して下さい。
これは私の例ですが、直下のエントリーフッターが回り込み、レイアウトが崩れてしまいました。
エントリーフッター部分のCSSコードの中に、clear: both;(回り込み解除)を追記しました。
CSSの追記場所が判らない場合は、htmlソース内の先ほど追記したボタンのソースの直下に<br style="clear:both;">を追記してみて下さい。
margin内の数値は、お好みで調整して下さい。

ボタンの並びは記事下の様になります。




>>続きを読む

スポンサーサイト

【Mac初心者日記】 Mac mini(MC816J/A)を購入

WindowsからMacへ乗り換えてみました。
最初にどのモデルかで悩んだのですが、Mac mini(Mid 2011)MC816J/A カスタマイズして購入しました。
サーバータイプのもののみ、クアッドコア (Quad-core)の2ドライブとなっており、検討したのですが、コア数よりGPUと言う選択で Mac mini(Mid 2011)MC816J/A にし、カスタマイズして購入しました。


Mac mini( Mid 2011)MC816J/A.jpg


◆ Mac mini 初期スペックとカスタマイズ後のスペック


Mac mini(Mid 2011)MC816J/A (初期のスペック)

  • OS:Mac OS X Lion
  • CPU:2.5GHz Dual-Core Intel Core i5
  • GPU:AMD Radeon HD 6630M(256MB)
  • メモリ:4GB(2GB×2) 1,333MHz DDR3
  • HDD:500GB(5,400rpm/東芝MK5065GSX)
  • その他:Thunderboltポート、USB 2.0×4、FireWire 800、SDXCカードスロット、オーディオ入出力(デジタル/アナログ両対応)

Mac mini(Mid 2011)MC816J/A (カスタマイズ後のスペック)

  • OS:Mac OS X Lion
  • CPU:2.7GHz Dual-Core Intel Core i7 ※
  • GPU:AMD Radeon HD 6630M(256MB)
  • メモリ:8GB(4GB×2) kingmax PC3-10600 1,333MHz DDR3 ※
  • HDD:Wストレージ 純正の500GB(5,400rpm/東芝MK5065GSX)に加え intel 320 Series SATA SSD 80GBを組み込み ※
  • その他:初期構成

と言った感じで、※印の付いた所が変更個所です。

まず、CPUの変更は工場出荷時(公式オンライン)の選択個所となっているので、予算的に多少無理しましたが、Core i7 へ変更しました。
技術的に優れた人なら個人でもカスタム出来るのかも解りませんが、素人ですのでなるべくお任せしたい。
続いてメモリですが、AppleストアやApple公式オンラインでは4GBから8GBに変更すると、18,480円のアップとなります。
対応メモリの現在の価格が、4千円前後で販売されてますので悩みどころでした。
Appleストアや公式オンライン以外で購入すれば価格を抑えられます(個人でも簡単に増設出来る様です)。
そしてHDDですが、純正のHDDが5,400rpm(主流は7,200rpm)と、若干遅めのHDD構成となっているため、SSDとの交換も考えましたが、250GB以上を選択すれば53,025円以上の出費。
しかも交換となってしまうので、容量が下がってしまいます。
公式オンラインでは、HDDについてはアップグレードやSSDへの変更は複数タイプから選べても、Wストレージ(HDDやSSD等の記憶装置を2つ設置する事)に関してはタイプを選べません。
「750GBシリアルATAドライブ + 256GBソリッドステートドライブ」の構成のみで、HDDも自動的に交換となってしまい容量は約1TBとなりますが、プラス66,360円となります。
なので、考えたのがApple専門店での購入で、Wストレージとし、システムやアプリケーションなどをSSD(80GB)に、その他ファイルの置き場所としてHDD(純正品)に・・・これで総容量は580GBとなり、パーツと工賃込みでプラス21,700円となります。
元々Mac miniには、「Server(サーバー)モデル」(2ドライブ)と言う構成のものがある様に、もう一台ドライブを組み込めるほどのスペースがあります。
専用のマウントを使えば、SSDとHDDと言った感じで、他のモデルにもドライブを2台組み込める様です。
デメリットとしては、放熱効果の低下が挙げられますが、使用環境に依存するところもあるので問題無しかと・・・。

実際、SSD上のファイルと純正5400rpmのHDD上のファイルの読み書きは、体感出来る程の差がありました。
システム用に追加したSSDが予算の都合上80GBでしたが、Windowsも入れる予定なので120GB以上欲しかったところです。

結局『 Mac mini(Mid 2011) MC816J/A 』の、CPUをCore i5からCore i7へ、メモリを4GBから8GBへ、500GBのHDDに80GBのSSDを追加して購入しました。

今回私が購入したのは 、Apple公式オンラインに Apple Premium Reseller として紹介されてるApple製品正規販売店 kitcut (キットカット)と言うショップで、上記の構成に「MacBook Air SuperDrive(6,800円)」を購入し、合計108,520円(消費税・送料込み)でした(詳細)。
オンラインで様々なカスタマイズの構成があり、メモリの増設も16GBまで可能となっていました(価格はかなりお高いですが・・汗)。

前回の記事でも書きましたが、Mac miniのメモリの増設は、非公式には16GBまで可能です。
昨年暮れ頃から16GBのメモリの販売価格が、かなりの値下げ傾向にありますので、価格が落ち着いたら16GBへの増設も考えてみたいと思います。

次回は、初期設定で早速のトラブルについて・・・(笑)



※メモリが安い《クレバリーeショップ 》《秋葉館オンラインショップ

※その他、Mac関連商品


AppBank Store

>>続きを読む

PR Link



☆動画MYページはこちら

バイオハザード オペレーション・ラクーンシティ バナー(120×60)









Link

このブログをリンクに追加する



上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。