はてなブログにスライドショーをコピペで設置!初心者向けカスタマイズ

f:id:buchibuchi4647:20170425124209j:plain

はてなブログにスライドショーを設置する手順を紹介します。初心者向けに詳しく解説しているつもりです。レスポンシブデザイン、パソコン、スマホデザインそれぞれのコピペコードを紹介していきます。

はてなブログにスライドショーを設置

記事内やサイドバーにスライドショーが設置していると読者の目に留まります。スライドショーは直帰率の効果につながると思います。また、設置することが難しいと思っている人も多いみたいで、利用者もあまり見かけません。実は簡単なコピペで設置可能なので、初心者の方も利用しやすいのでおすすめです。

スライドショーをカスタマイズ設置手順

今回参考にした記事はコチラ

【決定版】はてなブログ・スマホデザイン最強カスタマイズ集 – ひつじの雑記帳

はてなブログでスライダーを導入するきっかけを与えてくれました。とても感謝しています。

今回は記事内上下とサイドバーに設置する手順を紹介します。レスポンシブデザインとスマホデザインそれぞれコピペコードを紹介しますので、あなたのブログに合わせて、使ってください。

パソコン版またはレスポンシブデザイン向け

以下のコードを埋め込みしたい箇所にコピペしてください。たとえば、記事上なら、「デザイン」→「カスタマイズ」→「記事上」で表示したい場所に貼り付ける。「記事下」の場合も同様です。

URLリンク、画像リンク、タイトルにそれぞれ任意の情報を入力しましょう。

  • URLリンクは記事URLのことです。スライダーで表示したい記事です。
  • 画像リンクはスライダーで表示したい画像アドレスを意味します。
  • タイトルはスライダーの下部で表示される説明文を意味します。

他の設定

21行目の400の値を変更することでスライドショーの大きさを自由に変更できます。25行目で「次へ」、「戻る」のページャーの有無の設定ができます。26行目でタイトルの表示の有無の設定ができます。それぞれ有の場合は「true」、無の場合は「false」を入力してください。

現在はスライドは「2つ」に設定されていますが、増やしたい場合は、「li〜li」までをコピーして貼り付けてもらえると増やして使用可能です。

サイドバーに設置

サイドバーに設置する場合、「デザイン」→「カスタマイズ」→「サイドバー」で「html」を追加してください。「html」が追加できましたら、「編集」をクリックし、以下のコードをクリック。

貼り付けが完了したら、「適用」をクリックし「設定を保存」をクリックしてください。

その他の設定

その他の設定は上記で説明したパソコン•レスポンシブデザインと同様ですので、そちらを参考にしてください。

スマホデザイン向け

スマホデザインを設定されている人は以下のコードを任意の場所にコピーして貼り付けましょう。

URLリンク、画像リンク、タイトルを入力します。

  • URLリンクは記事URLのことです。スライダーで表示したい記事です。
  • 画像リンクはスライダーで表示したい画像アドレスを意味します。
  • タイトルはスライダーの下部で表示される説明文を意味します。

画像アドレスについてよくわからない人は以下

 

english-apple-diy.hatenablog.com

 

記事を参考にしてください。

 

その他の設定

24行目で「次へ」、「戻る」のページャーの有無の設定ができます。25行目でタイトルの表示の有無の設定ができます。それぞれ有の場合は「true」、無の場合は「false」を入力してください。

まとめ

スライドショーを使うことであなたのブログの印象はまったく違ってきます。初心者の人でも簡単にチャレンジしやすいカスタマイズです。この機会に挑戦してみましょう。

当サービスお得情報紹介・5名限定モニター生募集

当サイトのサービスはサイト作成だけでなく修正・カスタム・アクセスアップだけに留まらず、初心者向けに副業・アフィリエイトのノウハウも紹介しております。少しでも購入者が満足できるようなサービス提供を心がけております。

特に購入して終了ではなく。サービス終了後も定期的なやりとりを通じてお客様の相談・依頼をいただくことが一番重要だと思っております。長い付き合いになると思いますが、当サービスを利用して会社の利益アップ・脱ノウハウコレクターとなりませんか?

サービス概要に関してはこちらです。

 

学生・主婦の方から社会人の方まで幅広くご依頼をいただいております。

上記のサービスはいずれも好評です。特にアフィエイトをしている人でなかなか成果の出ない人や初心者で何からすれば良いのかわからない人にはおすすめのサービスとなっております。

サービスご依頼ご希望の方はサイト内に設置「お問い合わせ」フォームより依頼・または下記よりご連絡ください。当サービスはプロフィールにもありますよう「ココナラ」にて500件以上の販売実績と評価4.8以上であるプラチナ会員認定

ココナラ経由ではなく当サービスの「お問い合わせ」よりご依頼いただいた方には貴重な特典・割引価格で提供しております。このチャンスにぜひご検討ください。

ご依頼お待ちしております。

また、2020年にはあるモニター生が私のコンサルサポートを実施してココナラ での販売を開始しました。2020年7月末から8月末までの1ヶ月間での成果ですが。売り上げではなく、実際の収入見込みが22万達成できました。新規アカウントです。この調子で頑張って欲しいです。

上記のモニター生同様、ココナラ を使って副業サポートコンサル希望のモニター生を5名募集しております。

モニター価格は2種類あります。私が徹底的にサポートまたは定期的なアドバイスの2パターンあります。興味のある方は、こちらも合わせてお問い合わせよりご連絡ください。5名限定なので迷ったらとりあえずご連絡ください。

ご依頼・ご質問等はコチラから。内容を確認次第、順次対応させて頂きます。

お名前
必須
メールアドレス
必須
サービス内容
メッセージ本文
 
最新情報をチェックしませんか?