QHM (Quick Homepage Maker) ユーザのためのTips集。小技から大技までテクニック満載

コンテンツ編2

コンテンツ編2

No.C17 段組の外に枠線を引きたい [☆☆]

2段組の外を枠線で囲んで、中央を縦線で区切ります。
段組の外枠をそのまま使うと四角が横にふたつ並んだようになりかっこ悪いです。
そこで、段組の外にBOXを作りその枠を表示して、その中に枠表示なしの段組を作ります。
中央の区切り線は段組の右側のBOXの左枠線を表示させて縦線にします。
段組の中には、おまじないが書けます。

ここは、左側の情報
あいうえおかきくけこさしすせそたちつてとなにぬねの
ここは左側の情報です。左の段の文章です。ここは左側の情報です。左の段の文章です。ここは左側の情報です。左の段の文章です。

ここは、右側の情報
あいうえおかきくけこさしすせそたちつてとなにぬねの
ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。

コード

#html2(<div style="padding: 10px;border: 1px solid #cccccc;">)
#style2(style=width:45%;float:left;text-align:left;padding: 0 10px;){{
''ここは、左側の情報''
あいうえおかきくけこさしすせそたちつてとなにぬねの
ここは左側の情報です。左の段の文章です。ここは左側の情報です。左の段の文章です。ここは左側の情報です。左の段の文章です。
}}

#style2(style=width:45%;float:left;text-align:left;padding: 0 10px;margin-left:10px;border-left: 1px solid #cccccc;){{
''ここは、右側の情報''
あいうえおかきくけこさしすせそたちつてとなにぬねの
ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。ここは右側の情報です。右側の文章です。
}}
#clear
#html2(</div>)

No.C18 アフィリエイトの表示を変更したい [☆☆]

 提供されたアフィリエイトのテキスト素材に対し、素材には触らないで、CSSで文字サイズ、色などを変更する方法です。
規約に違反しない範囲での対処をお願いします。
楽天のアフィリエイトの場合は、アフェリエイトリンクの外から文字サイズ、色、書体のみ変更することはOKのようです。
  楽天のアフィリエイトのルール

 以下のサンプルは、ハッスルサーバのテキスト素材に対し、文字サイズ、色、太さなどを変更しています。

【解説】

  1. #beforescript内にmycss というクラスを定義します。
  2. そのクラスを使用して、アフィリのテキストに対し#htmlで指定します。
    <div class="mycss"> .... </div> で囲むのがポイントです。
    
    インライン要素として使用するときは、 div を span に変更してください。前後に改行は入りらなくなり、続けて他のコンテンツを並べることができます。

サンプル表示

【コード】
#beforescript{{
<style type="text/css">
<!--
.mycss a       {color: #0000ff; font-size: 20px; font-weight: bold;}
.mycss a:hover {color: #1e90ff; }
--> 
</style>
}}

#html{{
<div class="mycss">
<A href="http://px.a8.net/svt/ejp?a8mat=1U7XLY+2FIQPE+HQW+60OXE" target="_blank">【ハッスルサーバー】</A>
<img border="0" width="1" height="1" src="http://www19.a8.net/0.gif?a8mat=1U7XLY+2FIQPE+HQW+60OXE" alt="">
</div>
}}

このコードの部分だけをあるページに作成し、そのページを#includeプラグインで取り込むと便利です。

affiliate というページに作成した場合は、以下のようにして取り込む。

#include(affiliate,notitle)

ご意見箱

皆様のご意見をお待ちします。


認証コード(9536)

当ページは役に立ちましたか?

選択肢 投票
たいへん役に立った 13  
ちょっとだけ役に立った 0  
普通 0  
あんまり 0  

powered by QHM 6.0.8 haik
based on PukiWiki 1.4.7 License is GPL. QHM

最新の更新 RSS  Valid XHTML 1.0 Transitional