海外行ったことないけどebay輸出

ebay輸出のブログ / File exchangeの使い方 / Affinger4カスタマイズ / Amazonプライムビデオ

重要2017 Summer Seller Update で発表された新たな内容によると、2017年9月から写真/画像URLが使用不可となるようです。

したがって一部ご紹介しておりますebayテンプレートでの写真や画像URL挿入については、ドメインがebayに認められない限り使用できません。

また、商品について以外の余分な情報についても掲載を控えた方が良い可能性があります。以下はセラーアップデートの一部から引用した部分です。
Display your returns policy in the structured data fields

For the best buying experience, we recommend that you only include information about the product in the item description. Details about payment, shipping, or returns should be included in the structured data fields available for Business Policies.
余分情報については、Recommend アナウンスなので必ずではないと思いますが(制御できないだけ)、バイヤーを混乱させる独自ルールを設けるなというebayの通達だと思われます。

ebayテンプレートについての考え方はこちらで昨年書いた通りです。

参考:ユーザー規約の更新も行われており、細かく強制的な設定変更などされている可能性もあるかと思われますので、Site preferencesなどを今一度ご確認されることをおススメします。

Seller Hub > Overview > Shortcuts > Site preferences

Font Awesomeで画像いらずなebay テンプレートを目指す!

投稿日:2016年11月23日 更新日:

font-awesome-top

Awesome! 僕この言葉が好きです。その万能さ。とりあえずAwesome!使っとけーみたいな。

今回は、ebayテンプレートにもAwesomeに使える"Font-Awesome"の紹介です。

スポンサーリンク

Font-Awesomeで何ができるのか

ウェブフォントなのですが、見た目が「アイコン」になってるのがFont-Awesome。テキスト扱いできるので、CSSで色を変えたりサイズを変えたりとデザイン指定ができ、まさにAwesomeなフォントです。

サーバーでのホスティングも必要ありません。なぜならBootstrap CDNで呼び出せるから。今のウェブサイトでFont-Awesome使ってないところは見つからないぐらいネット上に浸透してます。

まー仕組みはそこそこに、ebayテンプレートにFont Awesomeを使う方法について紹介していくよ!

Font-Awesomeでフォントを変更してみる

さっそくアイコンを変更してみましょう!

サンプルとして当サイトの第4弾ebayテンプレートを使用します。すでにFont Awesome使ってるので、変更が分かりやすいから

テンプレートでFont Awesome使ってるのは、Information部分です。4-use-fontawesome

これを2ステップのコピペで変更してみましょう。

1、まずはFont Awesomeのサイトに行く。

font-awesome-top

>> Font Awesomeはこちら

Downloadって書いてますが、Downloadしなくても使えます。

つづいて、Iconsの所から、フォント一覧にいくicon-tab

ずらずらーっと並んでる中から好きなアイコンを選ぶ。選んだらアイコンクリックします。ポチawesome-icons

とりあえず意味もなくサッカーボールにしてみました。football

いろいろ情報がありますが、使うのはUnicodeです。

football2

サッカーボールのコードは、"f1e3"。これをコピーします。

2、テンプレートのソースにある記述を変更する

先ほどコピーしたユニコードをすでに指定しているコードと書き換えます。

第4弾テンプレートでは、ユニコードは97行目から118行目にいくつかそれらしいのがある。content:"~~"って部分。

とりあえず

content:"\f25a";

って書いてある部分の\後ろを書き換え!

content:"\f1e3";

はい、これで完了。

テンプレートをebayで見ると、サッカーボールマークが表れます。

change-football

やっべ、簡単じゃないですか?

簡単なのは、すでにFont Awesomeを使う準備がテンプレートに用意してあるから

上の方で「Bootstrap CDN」で呼び出せる!って書きましたが、自分のところに置いてないデータ(キャッシュ)を使うのが今回やってる方法です。

したがって、呼び出すための記述さえあれば、簡単にテンプレートでFont Awesomeが使用可能になるのです。

自分のテンプレートでFont Awesomeを使うには

自身のテンプレートにFont Awesomeを使う場合は、テンプレートにFont Awesomeを呼び出すための記述が必要です。以下の1行をコピペでOK!

現在のFont Awesomeバージョンに合わせてます。(※httpsに変更しました)

前にGoogle フォントを使ってテンプレートをもっとオリジナルにする方法で使ったやり方とほぼ同じです。

この1行をテンプレートの<head>と</head>の中に書き込めば、Font Awesomeが呼び出せるようになる。

あとはCSSの記述方法さえわかれば、どこにだって表示できるよ!

なぜなら Font だから! Wow, Awesome!!

見出しにFont AwesomeのCSSを当ててみる

せっかくサッカーボールのアイコンを見つけたので、スポーツ商品に向けたebayテンプレートを作ってみた。

昨日のチャンピオンズリーグ見ながら作ったので勢いだけのテンプレート。(#ダブル シンジおめでとう!)

foot-temp

デモページはこちら

※細かい修正してからテンプレート一覧に加えます。

さて、Font Awesomeを使っているの分かりますか?

foot-awesome

それぞれの見出しの前にサッカーボールのアイコンをつけてます。

Fontだからサイズ変更も色変更も自由自在

要素の前とか後ろとかにCSS指定するのは、:beforeや:afterを使います。

今回はこんな感じでHの見出しに対してサッカーボールアイコンをくっつけました。

positionとz-index使って、背景にどかーんとFont Awesomeも指定できるし、使い方次第でデザインの幅が広がるFont Awesomeでした。

どのテンプレートでも使用できると思うので、上記コードをコピペしてお使いください。

おすすめ記事一覧

mercari 1

先日、飲んで家に帰ってきたら Amazon から荷物が届いてました。 メルカリの売り上げで買った家電製品です。 ん? メルカリで買ったんだけど、、って次の日シラフになって気づいた所からの話 もくじメル ...

発送 2

日本郵便のEMS送料が値上がりしました。昨年の6月1日から300gの区分が廃止されて、全体が300円~500円上があがってます。アメリカまで300gで1200円の送料だったのが2000円ですよ! そう ...

e-pake 3

2016年10月1日から、国際郵便の発送方法が一つ追加されると発表がありました。 その名も「国際eパケット ライト」、eパケライト! スタートに向けて、詳細とそのほかの発送方法との違いを簡単に比較しま ...

affinger-eye 4

遂にサイトのテーマを変更しましたよ!導入したのはAFFINGER4です。 アフィリエイトするなら第一候補になるであろうAFFINGER4というワードプレステーマについてと導入理由を書きますね。 どうせ ...

amazon-prime-2000 5

2013年からずっとAmazonのプライム会員です!続けている理由がAmazonプライムビデオ! 僕は月に10本ぐらいで年間120作品の映画を見る生活を20年以上続けています。これって2,400本程度 ...

-ebay テンプレート

Copyright© 海外行ったことないけどebay輸出 , 2017 All Rights Reserved.