カテゴリ:
管理人より |
最初に参考にしたところ
一周年特別企画 「やる夫で学べないやる夫まとめブログの作り方 改訂版」 at 泳ぐやる夫シアター 様
その他は 「
やる夫まとめサイトの作り方」 at やる夫 Wiki 様 参照
Webフォントについてはこちら⇒
ブログでのアスキーアート表示用のWebフォント導入方法まとめ※AA表示方法が分かるまでにエントリーが600まで行ってしまって、現在AA直し中。
トップに戻るボタン(スクロールしてもついてくるやつ)の設置方法~超簡単ライブドアブログ・FC2ブログ編↑これが一番カンタン
ヘッダにカテゴリ一覧をプルダウンで表示
参考→
初心者でもできる簡単FC2ブログの作り方:ボタンなしのプルダウンをつくりたい!関連記事リストを任意の場所に表示したい↑参考にしました。
※自分の場合、<!--relate_list_area--><!--/relate_list_area-->は不要でした。
トップページでは記事を表示させない↑参考にしました。
ページ送りナビゲーション・
ページ移動スクリプト・
ページナビ(ページ移動スクリプト)の設置方法↑参考にしました。
・Dropboxに保存している画像ファイルをブログに表示する(埋め込む※直リンク)やり方
1、Dropboxへアップロードしたファイルを「共有」にする。
2、Dropboxのリンク画面で「共有」にしたファイルのファイル名を右クリックして「リンクアドレスをコピー」を行う。
コピーしたアドレスのコピー例 ⇒ https://www.dropbox.com/s/qhn7v4qknqcfg68/a-draw.com_7297.jpg?dl=0
3、コピーしたアドレスの「
www.dropbox.com」を「
dl.dropboxusercontent.com」に変更する。
末尾の「
?dl=0」は削除する。
ブログに埋め込む画像のアドレス ⇒ https://
dl.dropboxusercontent.com/s/qhn7v4qknqcfg68/a-draw.com_7297.jpg
もしくは、コピーしたアドレスの末尾の「
?dl=0」を「
?dl=1」へ変更する。
その場合の画像のアドレス ⇒ https://www.dropbox.com/s/qhn7v4qknqcfg68/a-draw.com_7297.jpg?
dl=14、ブログに表示する際は下記のようにする。
例 ⇒ <img src="https://dl.dropboxusercontent.com/s/qhn7v4qknqcfg68/a-draw.com_7297.jpg" width="50%">
※
width="50%"で画像表示のサイズ変更が可能。(縦横比は保持されます)
超簡単な折りたたみ展開メニュー↑参考にしました。
はきだめ: レスのポップアップライブドアブログでコメント欄にレスアンカーのポップアップ機能を実装する - ぐう速↑より一部転載&改変して、レスアンカーのポンプアップのやり方を書いてみる。
1.javascriptのソース ⇒
popup.js2.CSSに追加
↓ここから
#mypopup {
display: none;
position: absolute;
border:1px solid #bbb;
padding:5px 8px 8px;
color:#111;
background-color:#ffc;
list-style-type:none;
text-align:left;
max-width:1000px;
min-width:250px;
box-shadow: 3px 3px 3px #ccc;
-moz-box-shadow: 3px 3px 3px #ccc;
-webkit-box-shadow: 3px 3px 3px #ccc;
}
↑ここまで
3.Htmlの<head>~</head>内に追加 ⇒
<script type="text/javascript" src="http://アップロードしたファイルのURL/popup.js"></script>4.Htmlの<body>のすぐ下に追加 ⇒
<div id="mypopup"></div>5.レスは
<p id="resレス番">~</p>で挟む(別にaでもdivでもspanでもかまわない。この辺りは好みで)
6.レスアンカーの前後をこんな感じで挟む
<a href="javascript:void(0)" onMouseOver="popUp(46)" onMouseOut="hidePop()"> >>46
</a>例を書いてみる
・HTMLソース
<p id="290">290 名前:名無しのやる夫だお E-mail:sage :2015/03/01(日) 21:54:38 ID:rz/mixUQ0
なるほど、偽証が全く許されないのか。
……素晴らしいじゃないか、冤罪裁判が発生しないなんて(やられる方はたまったもんじゃないと思うが)
</p>379 名前: ◆NdaE78waTE E-mail:sage :2015/03/02(月) 00:28:49 ID:gwHnvRIA0
<a href="javascript:void(0)" onmouseover="popUp(290)" onmouseout="hidePop()">>>290
</a>悪いことしてなくてもフルオープンは、ちょっとねえw
・実際の表示
290 名前:名無しのやる夫だお E-mail:sage :2015/03/01(日) 21:54:38 ID:rz/mixUQ0
なるほど、偽証が全く許されないのか。
……素晴らしいじゃないか、冤罪裁判が発生しないなんて(やられる方はたまったもんじゃないと思うが)
379 名前: ◆NdaE78waTE E-mail:sage :2015/03/02(月) 00:28:49 ID:gwHnvRIA0
>>290悪いことしてなくてもフルオープンは、ちょっとねえw
※(2020.05.30)追記
↑のpopupの処理と「複数カテゴリ間の前後エントリー移動スクリプト」の処理がwindow.onloadで重複していたので
追加したスクリプトを別の記述方法で読み込み時処理をするようにした。
window.onloadに複数コールバック登録は不可!代わりの2つの方法DOMContentLoadedイベントとloadイベントの違い[タイミング]↑参考にしました。
CSS3の勉強になるかも!?画像を使わないボタンの作成手順↑参考にしました。
連続するリストを横並びに等分表示する方法↑参考にしました。
指定量スクロールした時点で上端にメニューを出す方法↑参考にしました。