「たこつぼくらぶ」にて制作したてがろぐスキンのデモを見れます。
新規投稿 管理用
or 管理画面へ #サンプル (11)#画像 (5)#[skin-tako-1] (3)#[skin-tako-5] (1)#[gallery-tako-1] (1)#[skin-tako-4] (1)#[skin-tako-3] (1)#[skin-tako-2] (1)#CSS (1) 共通内容表示サンプルスキンパーツCSSメモ返信
2023年3月6日の投稿[1件]
No.44
by admin. ⌚2023年3月6日(月) 01:04:40〔2年以上前〕 スキン <3787文字> 編集
初期表示に戻る
DASHBOARD
■全文検索:
表示中の日付範囲に限定して検索
複合検索窓に切り替える
■複合検索:
■新着画像リスト:
全12個 (総容量 1MB)
■日付一覧:
■日付検索:
■カレンダー:
■ハッシュタグ:
■カテゴリ:
■最近の投稿:
■フリースペース:
編集
▼現在の表示条件での投稿総数:
1件
▼最後に投稿または編集した日時:
2023年5月15日(月) 23:27:26〔1年以上前〕
▼特殊な表示モード:
RSSフィード
状況によってデザインが変わるスキン #skin-tako-5
試しに見てみる
●トップページ
●各種サンプル
●一覧(その1)
●一覧(その2)
<スキンについて>
●大きく分けて、汎用スキン・トップページ・疑似フレーム・目次(小説作品の展示を想定)の4種類
●skin-cover.html
ヘッダー・・・
メインタイトル(てがろぐHOMEへのリンク)、状況に応じた見出しの表示
メニュー・・・
記事の埋め込み・またはフリースペースを使用して、サイト内のメニューリンクを出力します。
HTMLに直接記述してももちろん大丈夫ですが、サーバーにアップロードする手間が必要になるため、
てがろぐ自身で完結する場合は今回のやり方がおすすめです。
記事埋め込みの場合は、まずメニューとなる記事を作成し、HTMLに記載のタグ[[ONEPOST:●●]]の
●●部分を、該当するIDに差し替えてください。
てがろぐ記事IDでのリンク・任意URLでのリンク、各種文字装飾はそのまま反映されます。
フリースペースを利用する場合は、HTMLが使えます。フリースペースタグ[[FREESPACE]]を
使用してください。
複数のフリースペースを使用する場合は、下記の公式リンクを参考に作成してください。
フリースペースの書き方(複数のフリースペースを設ける方法)
https://www.nishishi.com/cgi/tegalog/cus...
最近の投稿・・・
新着投稿・新着画像を表示するエリアです。
新着投稿で表示したい内容については、「設定」→【新着投稿リストの表示】から設定できます。
また、新着投稿については「下げる(一覧外)」の投稿も表示されます。
最近の公式サポート掲示板で、下げる投稿を表示しなくなる機能を検討します~」という質疑があったので、この部分はいったんこのままでも大丈夫そうかな…と思っています。。。質問者さん、ありがとうございます…!!
メイン・・・
てがろぐ記事・ページナビゲーション・ウィジェット(と呼んでいる検索窓等の表示部分)
ウィジェットエリアの各種機能については、後述するフッターアイテムのエリアに置いても
ほぼ同じ装飾で表示されると思います。
クイックポスト・・・
クイックポストのエリア
フッター・・・
フッターアイテム(メニュー同様、てがろぐ記事の埋め込み・フリースペースで
内容を挿入できます。
「無断転載禁止」等の注意書きやサイト情報など、すべてのページで表示されるような
内容を想定しています。
[[VERSION]]タグはてがろぐ公式の規約で必須のため、絶対に削除しないでください。
<div class=container>は、XREAサーバーで広告が隠れることを回避するために存在しています。
広告なしのサーバーの方は特に必要ありません。
後述のグリッド表示のコンテナとして使用しているので、その部分をbodyに書き換えてください。
書き換えなくても機能しますので、面倒な方、わからない方はそのままでも大丈夫です。
lightbox用のタグは、別スプリクトを使用している場合、適宜差し替えてください。
●skin-onelog.html
forPostAll・・・
記事一覧のページで全文を表示する(通常のブログ的な表示)
forPostTitle・・・
記事一覧のページでタイトルのみ表示する(小説作品等の展示を想定)
forPostTitleの部分については、特定のカテゴリのみで表示される、という運用を想定しています。
CSSでどのカテゴリで適用するかの切り替えを行います。
●CSSは、詳細をCSS本体に記載しております。
でも全然甘いです…にししさん、毎回更新のたびにたくさんコメントを書いてくださるの、改めて感謝いたします……!
注意事項は下記です。
●前回同様、配色はまとめて変更できます。
●skin-cover.htmlのbodyに付加した[[SITUATION:CLASS]]タグで、スキンの切り替えを行っています。
汎用スキン・・・
一覧と単独表示用に、特にクラスを指定していないプレーンなスキン
トップページ用のスキン・・・
サイトのトップページで表示する、大きな画像を表示します。
記事は表示せず、新着投稿・画像リストを表示します。
何か指定がある 状況での 一覧 表示(その1)・・・
PCでは2カラムで表示するスキンです。
グリッドレイアウトで表示しており、フレーム表示っぽくなっています。
特定のカテゴリーで適用したい場合、公式サイトを確認しつつ、「body.cat-●●」の
部分を書き換えてください。
装飾のカスタマイズ方法(状況に応じて装飾を変化させる、状況表示行の装飾)
https://www.nishishi.com/cgi/tegalog/cus...
(例)カテゴリーIDが「diary」のカテゴリーに適用したい場合、「body.cat-diary」
タグへの適用はやってみたんですがうまくいきませんでした…。
何か指定がある 状況での 一覧 表示(その2)・・・
タイトルのみ表示される一覧ページです。
skin-onelog.htmlの「forPostTitle」で表示される部分がここです。
小説サイトの作品一覧ページを想定しています。
「その1」と同じように、カテゴリーIDまたはユーザーIDなどで指定してください。
変更する部分は2か所です。
(1)「デザインの切り替え」で、タイトルを表示するページと全文を表示するページを
切り替える「body.cat-●●」の部分
(2)「何か指定がある 状況での 一覧 表示(その2)」の「body.cat-●●」の部分
何か指定がある 状況での 単独 表示・・・
インフォメーションページなど、少数のページに適用することを想定しています。
この記事自体がサンプルになっています。
表示したい記事を作成し、CSSの記事ID(log-●●の部分)を書き換えてください。
(例)記事IDが1の場合、「log-1」
●基本的に、このまま使うスキンというよりは、お好きに改変してもらって、
「てがろぐでサイトを作る」のたたき台になれば…と思います。
なるべく表示は簡易的になるように、機能への対応は網羅的に…と思って作ったスキンです。
●配布zip
こちら からどうぞ。
使用報告は不要です。
改変を前提としたスキンなので、大幅な改変を行ったスキンを作成される場合は、
「Theme by takotubo-club」の表記は削除していただいても大丈夫です。
※Powered by てがろぐ Ver~~の部分は削除しないでください!※
改変したスキンの配布なども行っていただいて大丈夫…
というかてがろぐ公式機能の応用に過ぎないのでお好きにしてくださって大丈夫です。
ただし、このサイトからダウンロードしたファイルそのままのスキンを再配布するのはご遠慮ください。
ご利用は自己責任でお願いいたします。