小説:章の一覧を表紙へ

600 views
  1. コメントする
  2. 記事検索
  3. 更新
  4. 凍結

0
まれ Chrome 2018/07/03 11:23
長編と短編を同じページに作成する際のレイアウトについてです。

以下のようにページを作成したいのですが、思うように行かず困っております。。。
解決方法を知りたくて投稿させていただきました。

────
名前変換タグ

長編タイトル@(←リンクなし)
01/02/03…(←章内のページリスト)

長編タイトルA(←リンクなし)
01/02/03…(←章内のページリストリンクつき)

長編タイトルB(←リンクなし)
01/02/03…(←章内のページリストリンクつき)

短編ページ@
短編ページA

────

・一括で名前変換
・長編の章内ページのリストを表紙へ(章内なので他の章や短編に次ページリンクが飛ばない)
・同ページに短編ページリストを入れる
上記のようにしたいのですが、四苦八苦しております。
ご存知の方いらっしゃいましたら教えていただきたいです。

よろしくお願いいたします。


残り990件書き込み可

10
まれ iPhone 2018/08/03 17:03
>>9
詳しい説明をしていただきありがとうございます!

おそらく >>1 さんと同じ事をご説明くださっているのかな?と感じました。
コメントアウトの発想がなかったので新しい発見でした!ありがとうございますm(_ _)m
PCから更新をしているのでどちらでも対応は出来そうです。試しながらサイトをいじってみたいと思います。
こんなにもレスを頂いけるとは思っていませんでした。ご親切な対応に感謝します。

これで自分が思ったようなサイト作成が出来そうです!
本当にありがとうございました!!
9
しち Firefox 2018/08/03 03:22
>>0
この条件だと、少なくとも長編は手打ちで <a>01</a>/… とリンクを貼っていく他ありません。
こういう感じでしょうか?→ http://alicex.jp/0piran0/novel/4/
【表紙画面編集】に、『長編は<a>手打ちで各本文ページへのリンクを貼る』+『短編は#list#による自動挿入でリンクを貼る』タイプのデモです。

長編はいちいち【表紙画面編集】に
*   <a href="5/">05</a>
という風にタグを書いて並べています。「長編タイトル」や「短編」は
*   <h2>長編タイトル@</h2>
という風に見出しタグで目立たせています。

ちなみになんですが、
● <a href="/ユーザーID/novel/1/5/">05</a>
● <a href="5/">05</a>
この二つ、どっちもジャンプ先は同じ《http://alicex.jp/ユーザーID/novel/4/5/》になります。
上がルート相対パス、下が相対パスでのリンクです。
手打ちするなら下の短いパスの方が楽ですが、#list#で自動挿入されるリンクは上の長いパスで書かれているみたいです。多分どっちでも良いと思うのですが、特に検証したことはありません、とだけ…。
デモページは短い方で書いています。

短編は#list#で自動的にテキストリンクが並んでいってます。
>コメントアウト『<!-- -->』を使って、章目次ページ(=長編目次)へのテキストリンクをまるっと非表示にして、短編以降のリンクだけを表示させているからです。
デモページだと、長編タイトル@の『タイトルの左』に「 <!-- 」、短編ページ@の『タイトルの左』に「 --> 」が入っています。
上手いこと説明できる気がしてこないので図にしました。

●利点:短編の更新時は、手打ちでリンクを貼らなくて良いので楽
●欠点:小説を並べ替えるときは、『<!--』と『-->』がどこに入ってるか把握してないと必要な部分まで非表示にしてしまったりするので注意が必要

>あとポイントは、『短編は章に入れず、トップ階層に置く』です。
そうすると表紙に置いた#list#で、各短編ページへのリンクが挿入されますので……。これも添付の図を見て頂いた方が分かりやすいかと。

デモページは、htmlの構造が把握しやすいようにと<h1>だとかの見出しを使っていますが、ろくにデザインはしておりません。
ただ、「01/02/03...」というタイプのリンクはタップしづらいので個人的な好みにより余白や行間を弄ってます。ギリギリ最低限“狙ったリンクを押せる”くらいの余白を入れるなら……という奴です。デザイン関係は板違いになるので割愛します。

【基本設定】で
>●ページ移動を『章の中のみ』
>●トップのページグループ化『しない』
にしているので、「前/次のリンク」は章の中に入っている長編にのみ有効、短編では一つ一つ独立する、という形になっています。短編も「前/次」移動したい場合はトップのページグループ化を『する』にするだけです。

コメントアウトを使うのが不安ならば、いっそ表紙に#list#を使わず、長編も短編もすべて手打ちで <a> タグによるリンクを貼っていくのも手です。
いずれにせよ>>0の条件だと、リンクの手打ちは要ります。

読んだ限りこうしたお話だったと思ったのですが、こういう感じでしょうか?長文の割にざっくりした説明ですみません。
418×329PNG
65KB

8
まれ Chrome 2018/08/02 13:40
>>7
ややこしい説明ですみませんでした。
ご理解いただけてよかったです。
レスいただきましてありがとうございました!
7
通りすがり iPhone 2018/08/02 12:11
>>6
あぁなるほど
<a>01</a>/<a>02</a>
このようなリンクと言うことでしたか

章内の2ページ目は自動的にはリンク表示されないようです

余談ですが
<a>01</a>/<a>02</a>
このようなリンクはユーザビリティ上好ましくないと思います
リンクもタップしにくいし、内容が分からない

よく<a>text</a>や<a>main</a>ってリンク表示されてるサイトを見かけますが
閲覧者のことを考えて作っていないなぁって思います

話しを戻しますが、運営に要望を出してみて賛同者を募ってみてはいかがでしょう

6
まれ Chrome 2018/08/02 11:43
>>5
返信ありがとうございます。
スマホでの簡単な確認だけ済ませてしまっており申し訳ございません。
再度PCでリンクなど確認させていただきました。
質問させてください。

私の意図としましてはサンプルにある

長編タイトル@
01/02/03…
この箇所のリンクはひとつですが

01→https://alicex.jp/index/novel/1/3/
02→https://alicex.jp/index/novel/1/4/

ページの中でリンクを移動するのではなく、目次ページ(https://alicex.jp/index/novel/1/)から直接02(https://alicex.jp/index/novel/1/4/)にも飛べるようにしたいのですが方法がありますでしょうか?
(※ページの中での移動は可能のままで。)

章内移動で作ると2ページ目以降のリンクが表紙に出てこない、ページ単体で作ると1ページごとにリンクが止まるかグループ化にして全てリンクが通るかのどちらかになってしまって…

何かいい方法がないかと思ってここに書き込ませていただきました。
長文になり申し訳ございません。
5
通りすがり Firefox 2018/08/02 10:10
>>4
サンプルページはデザインしていないので>>0で説明された配置を見せているだけで作りこんでません

再度ご覧ください
「長編タイトル@」「長編タイトルA」は章
その直下に日付リンクがあるのが章内に書いた小説です。

多分おっしゃっていることができてるように思います
違う箇所があれば再度書き込んでください


4
まれ Chrome 2018/08/01 20:40
>>3
レスありがとうございます。
ご丁寧に見本まで!><

私の説明が悪くてすみません。
結論から言いますと、短編と長編を同じページで作成した際
長編の時には章内で次ページへのリンクを止めたいのです。
現在のalice+さんではそれができず、他に方法がないか模索しておりました。

作成していいただいた見本ですと長編が一度目次ページに飛んでジャンプリンクでさらに移動となっているのですが、希望としては直接本文へと飛び、次ページのリンクでそのまま続きが読める、というようにしたいと思っていました。

もし可能な方法をご存知でしたら教えていただけると嬉しいです。

3
通りすがり Firefox 2018/07/31 09:16
>>2
https://alicex.jp/index/novel/1/
こういうことですか?
>>1のようなことをせずにできますよ

2
まれ iPhone 2018/07/10 16:41
>>1
返信ありがとうございます!
やはり少しゴリ押しする感じになるんですね…
とても詳しく教えてくださって嬉しいです!
1度試してみようと思います。
ありがとうございました(*´∀`)
1
ななし SOV33 2018/07/05 18:17
>>0
あんまりスマートじゃありませんが
目次の独自タグを使わず全て手打ちするか
もしくはタイトルの左右欄を使ってaタグを手打ちするくらいしか思いつきません……
どっちにしろ必ず相対パスで!

乱暴な方法ですが章タイトルを
</a>章タイトル<a href="">
と入力すれば、とりあえずリンクなしにはなります。
それで章タイトル右欄に
<br /><a href="1話目の相対パス">01</a>/<a href="2話目の相対パス">02</a>
のようにするとか

相対パスで、というのは、
・httpでもhttpsでも対応できる
・クッキーでなくセッションで名前変換してる人がいたら、絶対パスでのリンクでセッションが切れて名前変換が解除されるかも?
と考えたからです
1ページ中1ページ目

関連スレッド

関連スレッド



Back to Top