TOP

シリウスサイト内で流れる文字列の有効活用

記事内に掲載する流れる文字列は、カラム内にMTMLコードを配置すれば 記事幅にサイズは
自動調整されてしまいますが、HTMLテンプレートに置けば、サイのト全体幅に合わせることが
できます。

 

では、コンテンツに戻ります...

 

ヘッダー内への配置とかヘッダー下とかですね..

 

グローバルナビを設定している場合は、ナビ下へも置けるということです..

 

または フリースペースでも配置でも取り付けは可能..なんですね

 

物は考えようですね

 

ワールドプレスやその他サービスでも種類は違いますがヘッダー内に横移動とかの文字列も
表現はございます..

 

当該コンテンツは上部ページからの解説を継続しておりますので
詳細はこちらをご確認ください..
シリウス記事内に流れる文字列を配置するカスタマイズ

 

当サイトの解説は、シリウスデフォルトテンプレートに合わせたコンテンツで
HTMLコードのみで表示する..という形式で進めています

 

 

設置例
当サイトのヘッダーに配置してみました(過去デザインです)

 

 

フリースペースにも入れてみました

 

 

ヘッダーに配置できると年末年始のごあいさつや アフィリなら今月 今週の
おすすめとかに画像も入れられますのでさらに使えるかも...?

 

とうぜん テキストリンク 画像リンクを入れ込んでの配置ができますので
その使い方はさらに広がります..

 

 

その前にすぐ使えるよう記述を二つ記載しますので調整の意味合いを
ご確認ください

 

スピード調整 背景ラインあり
流れる文字列

 


 

<marquee scrollamount="7"bgcolor="#0A15FF"><font color="#ffffff">流れる文字列</marquee>

 


 

シリウスカスタマイズ 今年もあとわずか 体調に気お付けて良い年を迎えましょう!
7数値変更でスピード調整

 

bgcolor=#0A15FF
背景ラインのカラーコードです
今は青を指定してます

 

 

font color=#ffffff
文字色カラーコードです
今は白です

 

 

 

背景無
流れる文字列

 

背景ラインなしの記述です

 


 

<marquee scrollamount="3"><font color="#ffffff">流れる文字列</marquee>

 


 

縦幅は文字の大きさ 画像のサイズによって自動調整?
されますが

 

画像と 文字を組み込む場合は同じ縦サイズに合わせましょう

 

バラついても支障はないのですが 見た目がとてもヘンになります?

 

 

フリースペースに入れる際は 同列で動くとやはり編ですので
以下の記述のようにずらしを入れると また違う表現になります

 

<marquee scrollamount="3"><font color="#ffffff">流れる文字列</marquee>
<marquee scrollamount="3"><font color="#ffffff">   流れる文字列</marquee>
<marquee scrollamount="3"><font color="#ffffff">       流れる文字列</marquee>

 

 

 

 

スピード指定 9

 

流れる文字列  流れる文字列
        流れる文字列  流れる文字列
              流れる文字列  流れる文字列

 

 

 

 

 

 


 

記述コードの配置箇所

 

 

シリウスのHTMLテンプレートに置く場合は、個別配置では無く

 

トップ カテゴリー エントリ―ページ サイトマップ リンク集? までも
スタイル違いで配置できます

 

 

ヘッダー内に配置の例

 

 

 

 

 

ヘッダー内で表示する場合の記述する箇所は、HTMLテンプレート内の

 

ヘッダーここから
div id=header 記述の下に記載します

 

 

ご注意ごとを確認ください

 

記述を貼り付ける位置で違いがでます
この位置に配置した場合にはヘッダー画像位置に影響しませんが
余り良い位置とは言えません

 

 

headerText 記述の下にコードを置いた例では中央の位置に表示されます

 

配置参照

 

<!-- ★ヘッダーここから★ -->
<% pageTopic %>

 

<div id="header">
ここに置きます
<% headerText | tag_insert(a href="<% pageDepth %>") | tag_insert(h2) %>
<% pageDescription %>
</div>
<!-- ★ヘッダーここまで★ -->

 

 

pageDescriptionの下配置でもほとんど同じ位置で表示されます

 

 

 

 


 

グローバルメニュー下に配置する

 

ヘッダー上部掲載が好みに合わない方は グローバルメニュー下に
表示もできますが如何でしょう

 

 

 

 

記述配置の位置は、画像参照

 

 

記述確認

 

<!-- ★ヘッダーここから★ -->
<% pageTopic %>

 

<div id="header">
<% headerText | tag_insert(a href="<% pageDepth %>") | tag_insert(h2) %>
<% pageDescription %>
</div>
<!-- ★ヘッダーここまで★ -->

 

ここに、置きます

 

<!-- ★メインコンテンツここから★ -->

 

 

 

 

ヘッダーここまで...の下

 

メインコンテンツでの間に記載します

 

 

ここでご注意
ここはグローバルメニューが表示される位置なのです

 

グローバルメニューを表示させている場合は、その階層下に表示されますので
グローバルメニューに覆い尽くされ見えないとなるのです

 

ですのでグローバルメニューから下へはみ出るように3列の記述を
記載ください

 


 

上の2列行はグローバルの下に隠れますが
3番目ははみ出ますので見えるということです

 

 

隠されるコードのテキストが同じでは検索エンジンの評価に
影響を与えるかもしれませんので、異なるテキストを記載してください

 

 

テーブルを利用して..横一列に二つの流れ文字列を表現する

 

横に流れる文字の表現は最後の文字が左に隠れてから再度右から
現れますね

 

その間のブランクが気になる方は以下のようなスタイルは如何です?

 

 

その間のブランクが気になる方は2列表示など        如何なものかと?       え?こちらはお天気良いですよ

 

テキストを左右組み合わせると良い形になるかと思います

 

このスタイルはレイアウト枠でも可能です

 

当サイトはレイアウト枠が表示されないので
シリウスのテーブル枠..横2列を一段に改行しております
当サイトで試用している記述でコピーしてお使いください..

 

 

 

項目名に流れる文字列を記述します

 

 

<!-- ★テーブルタグここから★ -->
<table class="dsc2item col2" cellspacing="1">
<tbody>
<tr>
<th>項目名1</th>
<th>項目名2</th>
</tr>

 

<!-- ★insertRow(<tr><td>項目1</td><td>項目2</td></tr>)★ -->
</tbody>
</table>
<!-- ★テーブルタグここまで★ -->

 

 

組み合わせた場合の表示に枠が表示されますが

 

シリウスのtableCSSで 
borderの指定PXを0にすると削除されたとなります

 

また、背景色も画像背景に合わせて色コードを改行してください

 


 

終了しましたら保存をお忘れなく

 

プレビューで確認しましょう

 

 


 

追加カスタマイズ

 

CSS採用で作動を指示すると動きが滑らかに変化します

 

グローバルナビ下..当サイト例をご利用したい方は、巻末の
関連ページでCSS採用ページの解説をご確認ください...

 

では、うまくお役立てくださいね

 

スポンサーリンク

 

 

 

シリウスで流れる文字列の有効カスタマイズ
シリウス記事内に流れる文字列を配置するカスタマイズ
シリウスカスタマイズトップ

シリウスで流れる文字列の有効カスタマイズ関連解説
CSS採用でスーッと動くニュースメニューのラインソース
シリウスにプラグイン同様の動きでスーッと動く、静的作動のニュース&メニューのラインソースをCSSを含めて導入する手順のご案内です
スペースを空けずに文字を流すCSS指定
シリウスに流れる文字列を組み込んでも、文字行が終了してからの再表示 となるが通常の仕組みですが、ここでは終了以前に左から隠れ消えた行が 再登場する回転形式のCSS記述をご案内します。 ただし