楽天商品リンクを中央に配置する方法

トップページ ＞ 楽天 ＞ 楽天商品リンクを中央に配置する方法

 

シリウスに書いた記事の中に載せた

 

楽天の商品リンク１つを

 

ドーーーン！と中央に置く方法について、お伝えします。

 

 

 

楽天の商品リンク

 

ブログに載せるタイプというと、次の４つがあります。

 

 

◆　画像のみ

 

◆　テキストのみ

 

◆　QRコード

 

◆　画像＋テキスト

 

 

 

ひとつずつ、ご紹介していきますね。

 

 

◆　画像のみ

 

　　この場合は、リンクコードを全てマークして、こちらの中央揃えアイコンを押すだけです。

 

　　

 

 

◆　テキストのみ

 

　　このケースも画像のみと同じです。

 

　　リンクコードを全てマークして、中央揃えアイコンを押します。

 

 

◆　QRコード

 

　　こちらは、画像として、一旦、PCに保存して、シリウスに持ってきます。

 

　　その画像をシリウスに持ってくるときは、以下の２通りの方法があります。

 

 

　　・　ドラッグ＆ドロップで、直接、記事入力エリアにコピーする。

 

　　・　画像をこちら ↓ シリウスの画像格納ディレクトリーにコピーして、
　　　 記事入力エリアから呼び出す。

 

 

　　　【画像格納ディレクトリー】　　　　　　　　　　　【画像呼び出しボタン】　　　　　　

 

　　　　　ACES WEB
　　　　　　　SIRIUS
　　　　　　　　　data
　　　　　　　　　　対象サイトのファイル名
　　　　　　　　　　　　img

 

 

 

「そんなこと、シリウス・ユーザーなら誰でも知っとるわい！」

 

 

そうですよね。

 

 

でも、この商品リンク ↓ が一番使われているのではないか、と思いますが、

 

 

◆　画像＋テキスト

 

 

　　この場合は、ちょっとした小技が必要になります。

 

　　リンクもゴチャゴチャした文字が一番多いですし、

 

　　シリウスの中央揃えのアイコンを押しても 言うこと聞かないんですよ。（笑）

 

　　こちらの例でお伝えしますね。

 

 

 

 

 

青い塗りつぶし箇所は、なくてもかまいません。

 

なければ、画像テキスト・リンクの外側に出る横幅目一杯の枠が消えます。
（上記のリンクは、その外枠を消しています。）

 

そして、

 

これを言わなきゃいけませんね。

 

この画像テキスト・リンクを中央に持ってくるには、

 

赤い塗りつぶしの float:left を margin:auto に変更してください。

 

 

float:left 　このタグが出しゃばっているので、中央揃えのアイコンを押しても効かないんですよ。

 

これを中央に要素を配置できるタグ margin:auto に変えることで、
左から動かなかったリンクが、ど真ん中に来てくれます。 　

 

 

記事の文章との位置関係が見栄えいいように
画像の入った商品リンクは、真ん中に置きたい時があるかと思います。

 

そんなときは、この方法を試してみてくださいね。

 

 

 

楽天リンクを２つ３つ横に並べたいときは、こちらを。　

 

　　　　　　　　　　　↓　↓　↓

 

楽天商品の画像リンクを好きなように間隔空けて並べる方法

 

*-----------------------------------------------------------------------------------*

　　　最後までお読みいただき、ありがとうございます。
　　　記事が少しでも参考になれば幸いです。

　　　　　　　　　　　　　　　　　　　　　　

関連ページ

リンクシェアの商品リンクを横に並べたい　- はじめての質問 -

読者の方から質問を受けました。リンクシェアの商品リンクを３つ横に並べたいが、どうしても縦に並んでしまう。どうすればいいか？と。　楽天グループでも楽天のリンクコードとはタイプが違うので答え見つけるまでいろいろ調べました。そして、見つけたぁー！

楽天商品リンクの横に文章を入れる方法

楽天の商品リンクをブログやサイトに貼ったとき、リンクの横にコメントを入力したいと思ったことないですか？商品リンクをそのまま貼ると横幅が１００％独占されてしまうので、何も入力できませんが、この方法を使うと横に入れることができちゃいます。人がやっていないことをやってみよいうではありませんか。

楽天商品リンクの外側の枠とりたい

楽天の商品リンクを１つブログに貼ったけど、なんで、横幅いっぱいに外側の枠が表示されちゃうんだろう・・・・この外枠、取りたいなあ。　そう思ったことはないでしょうか？これだと、見た目がよくないですし、外枠を表示させている意味もわからないですよね。取る方法お伝えします。

楽天商品の画像リンクを好きなように間隔空けて並べる方法

もし、まだホームページを持っていない方で、ネットショップを作ってみたいという方は、ただ、サイト棚に商品を並べるだけではなく、キレイに魅せる裏ワザなど、これからお伝えしていきますので参考にしていただけたらと思います。もちろんシリウスのマニュアルには載ってませんからね。　こちらから。

楽天市場チャット　利用すべし

先日、ある商品を楽天から検索していました。プレミアム・カルピス って知ってます？カルピス・ウォーターでもなく、ソーダでもなく、オアシスでもなく フルーツ・カルピスでもない・・・・。カルピス・ウォーターをめ〜っちゃ濃い味に仕上げたカルピスなんです。　今すぐ詳細をご覧ください。

こんにちは

管理人のマナガツオです

私のブログに

お立ち寄りいただきまして

ありがとうございます

末永くお付き合いいただけると幸いです