bloggerでステマ規制法対策をしたい:テーマQooQ


ステマ規制法対策、QooQもお願い!!
イエッサー!


このブログの内容


bloggerのQooQも!

前回、テーマZELOのステマ規制法対策をしたのですが、QooQをお使いの方からQooQも!とのリクエストをいただいたので、対応しました!

QooQは本日初めて触りましたので、対応に不備があったらごめんなさい。←予防線


大丈夫、コピペでできるようにしましたよ!





こんな風にしたよ

出来上がりはこんな感じです。

パソコン

下に固定で出しています。
スクロールしても下に必ず表示されます。





スマホ

スマホでも下に固定しました。
各記事でも同じものが表示されます。








コードはこちら

今回はテーマを変更します。

変更前には必ずテーマのバックアップを取ってくださいね!



パソコン用のCSSを追加

コード内にカーソルを置いた状態で、Ctrl+Fをして「.Attribution」で検索します。
「@media ( max-width : 768px ) {」
の上あたりに、下記コードをコピペします。


  1. #footer2{
  2. height: 4em;
  3. }
  4.  
  5.  
  6. /*下部固定フッター*/
  7. #HTML1 {
  8. margin: 0;
  9. }
  10.  
  11. .adtext-section {
  12. z-index:2;
  13. margin: 0;
  14. width: 100%;
  15. /*背景色*/
  16. background-color:transparent;
  17. /*下に固定*/
  18. position:fixed;
  19. bottom: 0;
  20. /*高さを調整*/
  21. height: 1.8em;
  22. }
  23.  
  24. .adtext-section .box h2{
  25. background-color:white;
  26. font-size: 1.0em !important;
  27. text-align: center;
  28. color: #524e4d;
  29. font-weight: normal;
  30. }
  31.  



スマホ用のCSSを追加

コード内にカーソルを置いた状態で、Ctrl+Fをして「768px」で検索します。
「@media ( max-width : 768px ) {」
の中に、
下記コードをコピペします。


  1. #footer2{
  2. height: 3em;
  3. }
  4. /*下部固定フッター*/
  5. .adtext-section .box h2{
  6. font-size: 0.9em !important;
  7. /*高さを調整*/
  8. height: 1.5em;
  9. }

} 」と「 } 」の間ですので、画像とよく見比べて気を付けてコピペしてくださね。




HTMLを追加

コード内にカーソルを置いた状態で、Ctrl+Fをして「</body>」で検索します。


<p id='copyright'><data:blog.title/></p>
の上に、下記コードをコピペします。

  1. <div id='footer2'>

<p id='designed-by'><a href='http://qooq.dododori.com' target='_blank'>QooQ</a></p>
の下に、下記コードをコピペします。

  1. </div>
  2. <b:section class='adtext-section' id='adtext-section' showaddelement='yes'>
  3. <b:widget id='HTML1' locked='false' title='' type='HTML' version='1'>
  4. <b:widget-settings>
  5. <b:widget-setting name='content'>&lt;div class=&quot;box&quot;&gt;
  6. &lt;h2&gt;
  7. *当サイトはアフィリエイト広告を利用しています&#12290;
  8. &lt;/h2&gt;
  9. &lt;/div&gt;</b:widget-setting>
  10. </b:widget-settings>
  11. <b:includable id='main'>
  12. <!-- only display title if it's non-empty -->
  13. <b:if cond='data:title != &quot;&quot;'>
  14. <h2 class='title'><data:title/></h2>
  15. </b:if>
  16. <div class='widget-content'>
  17. <data:content/>
  18. </div>
  19. <b:include name='quickedit'/>
  20. </b:includable>
  21. </b:widget>
  22. </b:section>



<p id='copyright'><data:blog.title/></p>
<p id='designed-by'><a href='http://qooq.dododori.com' target='_blank'>QooQ</a></p>
の上下にコピペです。



これで下部にメッセージが出るようになったはず!!


背景色や文字色、サイズ、文言などは好きに調整してください。


ちなみに、テーマを保存すると、メニューから「ホーム」がいなくなることがあるので、レイアウトから「ヘッダーMENU」でホームを追加したり並び替えたりしてくださいね。





おわりに

テーマのQooQでも無事にできました!



皆さんのbloggerブログで、できたら教えてね!


無料で自由なbloggerを楽しみましょう!


この記事をシェアする

0 件のコメント :

コメントを投稿