スポンサーリンク


 

質問記事:HTML編集で「はてブアイコン」をPC版とスマホ版テンプレートで同時に使用する方法を教えて下さい!

質問します!



タイトル名の通り質問記事です。


質問内容

「はてブアイコン」をPCテンプレートとスマホテンプレート各々に貼って同時に使用する方法を教えて下さい!



これだけでは質問の意味がよく分からないと思うので補足します。


まず私のブログの個別記事にある「はてブアイコン」はPC版テンプレートのHTML編集で以下のタグを貼っています。


<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>




これをスマホテンプレートにも貼る事は出来るのですがある問題が生じます。
(下画像参照)

20170625113415616.jpg



画像の上がPCテンプレートの物で下がスマホテンプレートの物です。まずUSERSの数が違ってタイトルも違います。つまり別認識をしてしまっているのです。

原因は何となく分かります。画像の個別記事の場合PC版のURLが「http://blog-kuroneko.com/blog-entry-71.html」でスマホ版のURLが「http://blog-kuroneko.com/blog-entry-71.html?sp」となり「?sp」が入っているか入ってないかの違いがあるからです。タイトルに対してもPC版とスマホ版のテンプレートの指示が若干違っているからです。

質問内容を簡単にまとめると「はてブアイコン」をPCテンプレートにある物とスマホテンプレートにある物を一本化させたいという事です。

知りたい事を整理します!

■PCテンプレートに貼ってある「はてブアイコン」はそのままにしてこのアイコンの情報の物をそのままスマホテンプレートに貼る事は可能でしょうか?

可能であればその方法を教えて下さい!


■もし不可能あれば他になるべく手間がかからない良い方法を教えて下さい!




私の知識ではお手上げでどうしてよいのか分かりません(>_<)

また必要であればHTMLの画像も追記で貼ります。

ご協力をお願いしますm(_ _)m


追記

解決出来ました!


まず「はてブアイコン」をHTML編集でPCテンプレートとスマホテンプレートで同時に使うのは難しいそうです。
それならテンプレートそのものを一本化してしまえばよいという事です。

テンプレートの種類には「レスポンシブテンプレート」という物があります。「レスポンシブテンプレート」とは簡単に言うとPCとスマホの兼用テンプレートという事です。
これを使ってスマホ版テンプレートを非表示にします。


FC2ブログのやり方を紹介します。

管理画面を開き「テンプレートの設定」をクリック
  ↓
PC版テンプレートの部分の「共有テンプレート」をクリック
  ↓
検索の枠の「テンプレートの説明」というところに「レスポンシブ」と入力して「検索」をクリック

下画像参照

20170625113355498.jpg



この中から選べば無難です。補足しますと公式テンプレートにも「レスポンシブテンプレート」はありますが種類が少ない為「共有テンプレート」にしています。ただし「共有テンプレート」は使用する前に不具合があるかどうかは事前に調べた方がよいと思います!

あとは「管理画面」→「環境設定」→「ブログの設定」→「スマートフォン版表示の設定」→「無効にする」

作業は以上で終了です。

テンプレートを一本化する事によってランキングサイトのバナーやアフィリエイト広告などの管理も1度に出来たり、スマホテンプレートでは記事がどの様に映っているかなど気にしなくてよくなるというのもメリットだと思います。


情報を提供して下さった方々どうもありがとうございましたm(_ _)m


アクセスアップ・ブログ豆知識の目次はこちら


目次や最新記事はこちら(ホームへ)

 スポンサーリンク


 
にほんブログ村 小遣いブログへ  

  



このエントリーをはてなブックマークに追加  

※当サイトはリンクフリーです!



関連記事

コメント

黒猫さまこんばんわ~

いろーんな裏技があるのですね^^
ゲームの隠しコマンドぽくって、今回も勉強になりましたよv-290

がちょーさんへ

確かに隠しコマンド的ですね(^^)
実を言うと知恵袋でも同じ質問をしてまだ回答をもらっていないので記事にしました!
難問です(・・;)

No title

1、PC&スマホの共用テンプレート(レスポンシブ)を使う(私のブログで使用)

2、忍者のボタンセットを使う(私のブログで使用)


2は、どうなるかわかりませんが、試す価値はあるかと。



No title

あと、

SEO的にURLの正規化をした方がいいのでは?

私のブログには?SPなどのURLは存在しません。

No title

あ、

もしかして、すでにレスポンシブ&正規化済み?


FC2の設定の「スマートフォン版の表示」をOFFにすればできるんじゃ?


いちごちゃんへ

アドバイスありがとうございますm(_ _)m
いま私にはチンプンカンプンな状態なので少しずつ調べながら試していきます。
いろいろと選択肢がありそうですね!

それにしても詳しいですね!
関心しました(^^)

いちごちゃんへ


> もしかして、すでにレスポンシブ&正規化済み?

この意味がまだ分かってないので調べてみます。

スマホ表示を無効にする手は考えていましたがそれは最終手段で考えています。
とりあえずアドバイスしてもらった事をいろいろ試してみますね!

いろいろとありがとうございました(^^)

いちごちゃんへ

今さらレスポンシブというのを知りました。
正規化というのもした方が良さそうですね!

時間があるときにまとめてブログを改造します。
本当にいろいろありがとうございましたm(_ _)m
明日仕事早いのでもう寝ます。

おやすみなさい(^^)

No title

って、いうか

貴ブログは、PCのテンプレートでスマホを表示できるレスポンシブテンプレートです。

レスポンシブのテンプレートを使っているので、スマートフォンのテンプレートは不使用が鉄則です。




No title

.

かつて、SEOの記事を書いていたので、テンプレートのSEO対策やカスタマイズは詳しいです。

わからないことがあったら、質問してみて。

おやすみなさい。

いちごちゃんへ

アホですいません(>_<)

これで解決済ですね。
正規化はもっとよく調べてやってみますね!

今度こそ本当におやすみなさい(^^)

凄いコメントのやり取りに「お役に立てなくてゴメンナサイ!」です。

えいしんです。

この手の問題に関しては、はっきり言って
ちんぷんかんぷんです。
「いちごちゃん様」との、凄いコメントのやり取り
に「お役に立てなくてゴメンナサイ!」です。
何とか解決する事、心よりお祈りしています。

それでは、お疲れさまでした。

えいしんさんへ

いえいえ私も全然分かっていなかったので(^_^;

「質問記事」はかなり使える事が分かりました。
知恵袋で質問してたのですが閲覧数も少なく回答も1件も得られず困っていたのでとても助かりまた勉強にもなりましたした。

これに味をしめてまた困ったときには質問記事もアリかなって思いました(^^)
非公開コメント

プロフィール

黒猫

Author:黒猫
調べ事が大好きです(^^)

こちらはホーム用の「はてブ」です!

このエントリーをはてなブックマークに追加

応援お願いしますm(_ _)m

人気アプリランキング


スマホ・タブレットの方へ!

お勧めアプリを紹介!
全て無料!

(iOS・Android対応)
↓ランキング画面へ

「非ゲームアプリ10選」


「 ゲームアプリ10選」


「女性向けアプリ10選」


広告1

広告2

いらっしゃいませ!

オンラインカウンター

現在の閲覧者数:

検索フォーム

QRコード

QR