fc2ブログ

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ネタバレ防止カスタマイズ(続きを読むをたたむ~スクリプト無効ユーザー対応つき)

[10/31~11/1]かなり書き換え。検討経緯は、別記事へ移動
 経緯記事にあるとおり、もとは「映画評ブログ」のために、というリクエストだったのだが。『ブログで小説』としては、ウェブ小説の書評ブログの運営のためにも、あったほうがいいスクリプトだと思う。

■重要・アカマイ広告表示のブログでは使用しないでください■(規約違反に該当しても責任はとりきれません^^;)

謝辞

スクリプトについては、原作者に敬意を表する意味であえて名前を変更せずに使っています。
スクリプト「showPlagin」10plateさんのスクリプト(いたおさん、ご了解ありがとうございました)
スクリプト「hlclass」bkブログのものを改変(これはこれまでいろいろと使わせていただいているもので、何年か前に使用させてほしい旨コメントをどこかに入れた記憶があるのだが見つからない^^;)

HTML編集1:スクリプト挿入

以下を</head>のすぐ上に挿入。

<script type="text/javascript">
<!--
function showPlagin(idno){
pc = ('PlagClose' + (idno));
po = ('PlagOpen' + (idno));
if( document.getElementById(pc).style.display == "none" ) {
document.getElementById(pc).style.display = "block";
document.getElementById(po).style.display = "none";
}
else {
document.getElementById(pc).style.display = "none";
document.getElementById(po).style.display = "block";
}
}
function hlclass(name) {
var t = document.getElementsByTagName('div');
for (var i = 0; i < t.length; i++) {
if (t[i].className == name) {
t[i].style.display = "none";
}
}
return true;
}
//-->
</script>



bodyタグも書きかえる。

<body onLoad="hlclass('hd')">



HTML編集2:「more」部分をカスタマイズ

<!--more_link-->~<!--/more_link-->、<!--more-->~<!--more-->を書き換える。(テンプレートによって若干ズレがあるかもしれないので、これでダメならコメントを)

<!-- ▼★ネタバレ防止★▼ -->
<!-- ▽トップページ、moreがある場合 -->
<!--more_link-->

<p id="PlagOpen<%topentry_no>" class="entry-more">
<a href="<%topentry_link>#PlagClose<%topentry_no>" title="続きを開く
Javascript無効では個別記事頁へ" onclick="showPlagin(<%topentry_no>);return false;">Open▽ </a>
</p>

<div class="hd" id="PlagClose<%topentry_no>" style="display: none">
<%topentry_more>
<p class="entry_more">
<a href="#PlagOpen<%topentry_no>" title="続きを閉じる" onclick="showPlagin(<%topentry_no>);">Close△</a>
</p>
</div>
<!--/more_link-->

<!-- ▽個別ページ、moreがある場合 -->
<!--more-->

<noscript>
<p style="padding:40px 0 400px 0;text-align:center;">↓↓↓続きを読む場合は、下へスクロール↓↓↓</p>
</noscript>

<div id="PlagOpen<%topentry_no>" class="entry-more">
<a href="#" title="Javascirpt無効では動作しません" onclick="showPlagin(<%topentry_no>);return false;">
Open▽
</a>
</div>

<div class="hd" id="PlagClose<%topentry_no>">

<%topentry_more>

<p id="Plag2Open<%topentry_no>" class="entry-more">
<a href="#PlagOpen<%topentry_no>" title="Javascirpt無効では動作しません" onclick="showPlagin(<%topentry_no>);">
Close△
</a>
</p>
</div>
<!--/more-->
<!-- ▲★/ネタバレ防止★▲ -->



スタイルシート編集

 必須ではありません。

p.entry-more {margin:0;
line-height:1;
padding : 25px 0px 0px 0;
text-align : right;}



記事の途中を畳む

 ウェブ小説企画参加時など、1記事のなかに複数のネタバレ感想を列挙するケースがある。
 記事を書く最中に挿入することになるため、煩雑になるのを避けて、なるべく略式にしてみた。スクリプトオフの読者への「目に入ってしまう」という問題は、レアケースなので、無視する。(スクリプトオフでは読めないよりはマシだろう)。無視しないのがお好みの方は、テンプレート改造のほうを参考に組み立てなおしてみていただきたい。
 以下「【ここに番号】」とある箇所には、すべて同じ番号が入る。1記事にいくつもこのスクリプトを使用する場合には、たとえば1組目は34401、2組目は34402などなど、「開くスイッチの番号」と「ネタバレ部分の番号」が一致し、かつ、複数の「ネタバレ部分」が重複しないように番号を選べば動作するはず。

<a href="javascript:void(0)" title="ネタバレ部分を開きます(Javascript無効設定では動作しません)" onclick="showPlagin(【ここに番号】);return false;">▽</a><noscript>ここからネタバレ(Javascript有効設定では畳まれます)</noscript><div class="hd" id="PlagClose【ここに番号】">
■ここにネタバレ文■
<a href="#PlagOpen<%topentry_no>" title="ネタバレ部分を畳みます(Javascript無効設定では動作しません)" onclick="showPlagin(【ここに番号】);return false;">△</a><noscript>ネタバレここまで(Javascript有効設定では畳まれます)</noscript></div>


カスタマイズサンプル

 公式skyphoto/スクリプト導入トップ/個別記事
サンプル
■ここにネタバレ文(上記「個別記事」をクリックし、スクリプト導入テンプレを表示させたときのみ有効) ■
■ここにネタバレ文(上記「個別記事」をクリックし、スクリプト導入テンプレを表示させたときのみ有効)■
関連記事
スポンサーサイト



コメント

-

管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます

麻生(阿檀)

鍵コメの方、
とりあえず
http://blog.fc2.com/forum/viewtopic.php?f=3&t=13902
をどうぞ。このテンプレートはカラム幅が狭いので、この手の質問を受けるにはあまり向いていません^^;、できれば続きはフォーラムで。
非公開コメント

麻生(阿檀)

【このブログについて】
ブログで小説を手軽に連載したい方のための、
ブログ紹介/FC2テンプレート紹介が、メインだったはずなのですが。

ミ^。^彡っ。oO○(いつのまにやら、かなりとんでもなくごった煮ブログになっております。)

カレンダー

05 | 2023/06 | 07
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -

検索フォーム

タグリスト

                                                 

プロフィール

麻生(阿檀) Author:麻生(阿檀)

【このブログについて】
ブログで小説を手軽に連載したい方のための、
ブログ紹介/FC2テンプレート紹介が、メインだったはずなのですが。

ミ^。^彡っ。oO○(いつのまにやら、かなりとんでもなくごった煮ブログになっております。)

MyToyBox

Clock!
doodel ?publish
?style3=10084&index



34401 02 03 04
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。