雑が喰おう

SleipnirのHeadline-Reader Pluginのスタイルシートをいじる方法

Sleipnir 2 完全攻略ガイド

私のブラウザはFenrir & Co.Sleipnirの愛用している。
だもんで、RSSもHeadline-Reader Pluginで取得閲覧している。
しかし、Headline-Reader Plugin標準のスタイルシートでは文字が小さいし、背景が真っ白で、目がチカチカして長く見ていると疲れてくるという欠点がある。
そこで、前々からスタイルシートを弄ってやろうと思ってはいたが、いかんせん、肝心のそのスタイルシートがどこにあるのか解らず、探すのもめんどくさかったので後回しにしていた。

しかし、本日、ついに、Headline-Reader Pluginのスタイルシートを弄ってみた。
これから先、再インストールすることになったり、Headline-Reader Pluginのスタイルシートを弄りたいけれど、どこにあるのか解らないという人もいるかもしれないので、記しておく。

まず、Headline-Reader Pluginの標準のスタイルシートは、

<インストールした場所>\Sleipnir\resources\skins\default\headlinereader\description.html

なんせ、スタイルシートだから、CSSファイルであるとばかり思っていたのが間違いの元で、htmlくんだったことに気づいたのは探し当てた時だった。
同じフォルダ内に、Skin.txtというテキストファイルがあるので、表示させる内容を変えたい人はそれを参考に弄るのも良いかもしれない。
私個人としては、ただ単に文字の大きさと背景色を変えたいだけなので、直接 description.html に記載されているスタイルシートだけを弄ることにした。
最終的には、文字の大きさと背景色と、リンクの色などを弄った。
<!-- saved from url=(0014)about:internet -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<style type="text/css">
<!--
body{
font-family: verdana;
margin  : 0;
padding : 12px;
color: #ffffff;
background-color: #e8e8e8;
}

div.channel_title{
font-size : 100%;
font-weight : bold;
background-color:#ff00ff;
}

div.channel_desc{
padding-top  : 0.5em;
font-size : 80%;
}

div.main{
margin-right:2%;
margin-left: 2%;
padding: 0em 0.8em 0.6em 0.8em;
border : 1px solid #4a4a4a;
height :100%;
font-size: 140%;
line-height:140%;
color: #ffffff;
background-color: #444444 ;
}

h1.title{
color : #888888;
margin : 0px;
font-size : 120%;
font-weight : bold;
line-height : 1.3em;
padding: 0.6em 0.3em 0.1em 0em;
}
h1.title a:link{
text-decoration: none;
color : #ff6633;
font-weight : bold;
}
h1.title a:visited{
text-decoration: none;
color : #993399;
font-weight : bold;
}
h1.title a:active{
text-decoration: none;
font-weight : bold;
}
h1.title a:hover {
text-decoration: underline;
font-weight : bold;
}
div.desc{
margin : 0px;
padding-top: 0.5em;
font-size : 100%;
line-height : 1.3em;
width : 100%;
height : 91%;
}
div.right{
color : #777777;
margin : 0px;
padding-top: 0.5em;
font-size : 80%;
text-align: right;
}
img {
border : 0px;
padding : 2px;
}
a:link{
text-decoration: none;
color : #ff6633;
}
a:visited{
text-decoration: none;
color : #993399;
}
a:active{
text-decoration: none;
color : #222299
}
a:hover {
text-decoration: underline;
color : #FF33FF;
}
blockquote {
padding: 0px 4px;
border-left: 3px solid #cccccc;
margin-left : 20px;
}
hr{
color: #cccccc;
height: 1px;
}
UL{
list-style-position: outside;
margin  : 0em 0em 0em 1em;
padding-left:1em;
}
-->
</style>
<title>$HTML_TITLE$</title>
</head>
<body>
<div class="main">
<h1 class="title">$ANCHOR_ITEM_TITLE$</h1>
<div class="desc">
$ITEM_DESCRIPTION$
<div class="right">
$ITEM_DATE$ $ITEM_CREATOR$
<br>$ANCHOR_CHANNEL_TITLE$ $ANCHOR_CHANNEL_FEED$
<br>$ANCHOR_IMAGE$
</div>
</div>
</div>
</body>
</html>
すべてを記すと正規な指定の仕方かどうか独学なもんで、ツッコミなどがきそうで恥ずかしいが、今後の自分用にということで記しておく。
もし、表示内容を変えたいと思っている方がいれば参考までに。


スポンサード リンク

スポンサード リンク

»関連してそうな記事