てがろぐ
- Fumy Otegaru Memo Logger -
カテゴリ「カテゴリなし」の投稿［3968件］（54ページ目）
今日はちょっと暑いような……？
- 箇条書きって「そう見えるように書けば済む」と考えていたので、ずっと専用記法は設けなかったのですけども、ul要素とかol要素とかでインデントされれば、それはそれで見やすいんですよね。特に、ウインドウの端で折り返された2行目以降にもインデントが影響する点が。
- あと、HTMLのリストとして出力できれば、それ専用のCSSを用意しておくことで自由に装飾しやすいメリットもある気がします。
- デフォルトではul要素を使う箇条書きリストになりますが、オプションでol要素を使う番号付きリストにしたり、dl要素を使う説明リストにしたりもできます。任意のclass名を指定することもできるので、事前に装飾を用意しておけばいろいろ活用の幅は広げられる（かもしれない）な……とは思います。
文字装飾に「リスト」が加わった Ver 3.8.3(未配布)の動作テスト。
▼普通の箇条書きリスト
▼箇条書きリストの中に箇条書きリスト（何層でも可）
▼先頭記号を指定した箇条書きリスト
▼番号付きリスト（開始番号指定）
▼任意のclass名を付加した箇条書きリスト
▼説明リスト(dl要素＋奇数dt要素＋偶数dd要素)
▼普通の箇条書きリスト
- チョコレート
- ドーナツ
- ショートケーキ
▼箇条書きリストの中に箇条書きリスト（何層でも可）
- チョコレート
- ドーナツ
- ゴールデンチョコレート
- チョコファッション
- エンゼルフレンチ
- ショートケーキ
▼先頭記号を指定した箇条書きリスト
- チョコレート
- ドーナツ
- ショートケーキ
▼番号付きリスト（開始番号指定）
- チョコレート
- ドーナツ
- ショートケーキ
▼任意のclass名を付加した箇条書きリスト
- チョコレート
- ドーナツ
- ショートケーキ
▼説明リスト(dl要素＋奇数dt要素＋偶数dd要素)
- チョコレート
- 食べたい🍫🍫🍫
- ドーナツ
- 食べたい🍩🍩🍩
ドーナツ食べたい……のだけど、4分の1くらいでいい。
🍩Re:3111＆3114◆反応ありがとうございます。予約投稿機能も需要はあると分かってありがたいです。そう遠くないうちに実装する予定でいます。
🍩Re:3112◆β版のご試用をどうもありがとうございます。たしかに新着画像リストは、あるのとないのとではずいぶんリッチさが異なるなとは感じました。意図していませんでしたが意外な効果です。^^; ご活用頂ければ幸いです。
🍩Re:3113◆β版のご試用をどうもありがとうございます。Instagramの埋め込みはもっと大変だと思っていたんですが、よくよく調べるとTwitterとほぼ同じ感じで埋め込めることが分かったので実装できました。いつからこの仕様だったのか分かりませんが、昔からそうだったのならもっと早くに実装できていたハズでした。^^;;;
🍩Re:3111＆3114◆反応ありがとうございます。予約投稿機能も需要はあると分かってありがたいです。そう遠くないうちに実装する予定でいます。
🍩Re:3112◆β版のご試用をどうもありがとうございます。たしかに新着画像リストは、あるのとないのとではずいぶんリッチさが異なるなとは感じました。意図していませんでしたが意外な効果です。^^; ご活用頂ければ幸いです。
🍩Re:3113◆β版のご試用をどうもありがとうございます。Instagramの埋め込みはもっと大変だと思っていたんですが、よくよく調べるとTwitterとほぼ同じ感じで埋め込めることが分かったので実装できました。いつからこの仕様だったのか分かりませんが、昔からそうだったのならもっと早くに実装できていたハズでした。^^;;;
>3099 予約投稿機能について
深夜帯に投稿してしまうことが多々あるので、実装していただけると嬉しく思います・・・！
深夜帯に投稿してしまうことが多々あるので、実装していただけると嬉しく思います・・・！
てがろぐCGIでギャラリーサイトっぽい構造を作った際の実例：
🌰この名古屋のリフォーム会社の施工例ページが、てがろぐで生成されています。ギャラリーっぽい表示で、クリックすると個別ページに飛びます。これは特にギャラリーモードを活用しているわけではなく、「全投稿に必ず1枚以上の写真を掲載する」という前提で運営しているので、「画像ありき」のスキンを作って通常モードで使っています。（たとえ画像がなくても、サムネイル領域が空白になるだけで、表示が崩れることはありませんけども。）
🌰スキンが1つしかないのに「TOPではギャラリーっぽい表示」で「単独投稿ページでは全文表示」になっているのは、内側スキンskin-onelog.htmlを次のように書いているからです。
<!-- ▼TOPでのみ表示する部分 -->
<div class="oneWorkBox forLinkListBox">
<a href="[[PARMAURL:FULL]]" class="oneItemOnLinkList">
<span class="oneLinkImage"><img src="透明GIF" width="300" height="300" alt="" style="background-image:url('[[GETURL:PICT:1]]');"></span>
<span class="oneLinkTitle">[[COMMENT:TITLE]]</span>
<span class="oneLinkDate">[[DATE:Y.M.D]]</span>
</a>
</div>
<!-- ▼単独投稿表示時でのみ表示する部分 -->
<div class="oneWorkBox forIndividual">
<p class="workDate">[[DATE:Y.M.D]]</p>
<h3 class="workTitle"><a href="[[PARMAURL:FULL]]">[[COMMENT:TITLE]]</a></h3>
<p class="workMain">
[[COMMENT:BODY]]
</p>
</div>
このようにHTMLを書いておいて、
●投稿単独表示時では .forLinkListBox を display:none; にし、
●それ以外の状況では .forIndividual を display: none; に
しています。こうすると、1つのスキンだけでも「単独投稿表示時」と「それ以外」とでデザインを別々に用意できます。（よほど本文が長い場合には、無駄にHTMLソースが長くなる問題はありますが。）
畳む
🌰さらに、このリフォーム会社のHOMEページ冒頭では、投稿の最新10件をループスライダーで無限ループ表示させています。右から左へ向かって流れていく「施工例」の部分です。ここは、埋め込み用に作成したスキンを使って埋め込んでいます。クリックすると、投稿単独ページに飛びます。
🌰ここは、外側スキンを次のように書いて
<!-- ループスライダー -->
<div class="loopSlider">
<ul>
[[TEGALOG:10]]
</ul>
</div>
[[VERSION]]
（※VERSION部分は、ライセンスがあるので非表示になっています。）
畳む、内側スキンを以下のように書いて
<li>
<p class="loopBoxImage forLinkListBox">
<a href="[[PARMAURL:PURE:FULL]]" class="oneItemOnLinkList">
<span class="oneLinkImage"><img src="透明GIF" width="142" height="142" alt="" style="background-image:url('[[GETURL:PICT:1]]');"></span>
<span class="oneLinkTitle">[[COMMENT:TITLE]]</span>
<span class="oneLinkDate">[[DATE:Y.M.D]]</span>
</a>
</p>
</li>
（※ここでも「1枚目の画像」をbackground-imageで掲載しているのは、さっきと同じ理由です。）
畳むいるだけです。
使っているスキンは、メインのが1つと、ループスライダー埋め込み用のが1つの、計2つです。
🌰この名古屋のリフォーム会社の施工例ページが、てがろぐで生成されています。ギャラリーっぽい表示で、クリックすると個別ページに飛びます。これは特にギャラリーモードを活用しているわけではなく、「全投稿に必ず1枚以上の写真を掲載する」という前提で運営しているので、「画像ありき」のスキンを作って通常モードで使っています。（たとえ画像がなくても、サムネイル領域が空白になるだけで、表示が崩れることはありませんけども。）
🌰スキンが1つしかないのに「TOPではギャラリーっぽい表示」で「単独投稿ページでは全文表示」になっているのは、内側スキンskin-onelog.htmlを次のように書いているからです。
<!-- ▼TOPでのみ表示する部分 -->
<div class="oneWorkBox forLinkListBox">
<a href="[[PARMAURL:FULL]]" class="oneItemOnLinkList">
<span class="oneLinkImage"><img src="透明GIF" width="300" height="300" alt="" style="background-image:url('[[GETURL:PICT:1]]');"></span>
<span class="oneLinkTitle">[[COMMENT:TITLE]]</span>
<span class="oneLinkDate">[[DATE:Y.M.D]]</span>
</a>
</div>
<!-- ▼単独投稿表示時でのみ表示する部分 -->
<div class="oneWorkBox forIndividual">
<p class="workDate">[[DATE:Y.M.D]]</p>
<h3 class="workTitle"><a href="[[PARMAURL:FULL]]">[[COMMENT:TITLE]]</a></h3>
<p class="workMain">
[[COMMENT:BODY]]
</p>
</div>
このようにHTMLを書いておいて、
●投稿単独表示時では .forLinkListBox を display:none; にし、
●それ以外の状況では .forIndividual を display: none; に
しています。こうすると、1つのスキンだけでも「単独投稿表示時」と「それ以外」とでデザインを別々に用意できます。（よほど本文が長い場合には、無駄にHTMLソースが長くなる問題はありますが。）
※上記で、「投稿1枚目の画像」を background-image で表示しているのは、元の写真の縦横比に関係なく正方形に描画するためです。今ならそんな回りくどい方法を使わなくてもCSSで object-fit: cover; とか書けば良いのですが、このサイトでは（企業サイトなので）一応ふるーいブラウザ(IE11等)で閲覧された場合も考慮して、背景画像を駆使する方法を使っています。
畳む
🌰さらに、このリフォーム会社のHOMEページ冒頭では、投稿の最新10件をループスライダーで無限ループ表示させています。右から左へ向かって流れていく「施工例」の部分です。ここは、埋め込み用に作成したスキンを使って埋め込んでいます。クリックすると、投稿単独ページに飛びます。
🌰ここは、外側スキンを次のように書いて
<!-- ループスライダー -->
<div class="loopSlider">
<ul>
[[TEGALOG:10]]
</ul>
</div>
[[VERSION]]
（※VERSION部分は、ライセンスがあるので非表示になっています。）
畳む、内側スキンを以下のように書いて
<li>
<p class="loopBoxImage forLinkListBox">
<a href="[[PARMAURL:PURE:FULL]]" class="oneItemOnLinkList">
<span class="oneLinkImage"><img src="透明GIF" width="142" height="142" alt="" style="background-image:url('[[GETURL:PICT:1]]');"></span>
<span class="oneLinkTitle">[[COMMENT:TITLE]]</span>
<span class="oneLinkDate">[[DATE:Y.M.D]]</span>
</a>
</p>
</li>
（※ここでも「1枚目の画像」をbackground-imageで掲載しているのは、さっきと同じ理由です。）
畳むいるだけです。
使っているスキンは、メインのが1つと、ループスライダー埋め込み用のが1つの、計2つです。
新着画像のサムネイルいいですね！
自分でこんな感じのやれないかな〜と考えたことありましたが、分からなかったので嬉しいです😆楽しみです。
自分でこんな感じのやれないかな〜と考えたことありましたが、分からなかったので嬉しいです😆楽しみです。
パスワード機能、実装してくださり嬉しいです！
いつもありがとうございます。
いつもありがとうございます。
Twitterのメディア欄みたいな、新着画像リストが表示できるようになった Ver 3.8.2(未配布)の動作テスト。
まだ標準スキンしか作っていないので他のスキンでは見えませんが。 [[IMAGELIST]] と書くと、そこに投稿画像が指定個数だけ表示されます。画像をクリックすると、その画像が使われている投稿に移動できます。いくつ掲載されるかは設定で指定できますが、[[IMAGELIST:12]] のように書けば、スキン側で強制的に個数を指定することもできます。
まだ標準スキンしか作っていないので他のスキンでは見えませんが。 [[IMAGELIST]] と書くと、そこに投稿画像が指定個数だけ表示されます。画像をクリックすると、その画像が使われている投稿に移動できます。いくつ掲載されるかは設定で指定できますが、[[IMAGELIST:12]] のように書けば、スキン側で強制的に個数を指定することもできます。
画像投稿テスト📸
畳む
畳む
テスト
インスタグラムの埋め込みテスト
インスタグラムを埋め込める Ver 3.8.2β はまだ配布していません。もうしばらくお待ち下さい。
（Instagram埋め込み処理中...）Instagramで見る
インスタグラムを埋め込める Ver 3.8.2β はまだ配布していません。もうしばらくお待ち下さい。
コロッケパンも食べました。
公開日時を事前に指定しておく予約投稿機能って需要ありますかね……？
よくよく考えると、そんなに大規模な追記をしなくても実現できそうな気がしてきましたので、思いついたアルゴリズムに穴がなければ(^_^;)そう遠くないうちに実装できそうな気がします。
公開日時を事前に指定しておく予約投稿機能って需要ありますかね……？
よくよく考えると、そんなに大規模な追記をしなくても実現できそうな気がしてきましたので、思いついたアルゴリズムに穴がなければ(^_^;)そう遠くないうちに実装できそうな気がします。
Ver.3.8.1リリースお疲れ様です！>>3037さんとは別人ですが、サイドコンテンツ各種でもギャラリーモード等を維持したリンクを出力する記法は私も欲しかったので嬉しいです。早速ギャラリーモード用スキンを書き換えて、正常に動作するのを確認出来ました。
てがろぐは「こうだったらいいのにな」と思っていることがどんどん実現していって、とても重宝しています。いつも更新ありがとうございます！
てがろぐは「こうだったらいいのにな」と思っていることがどんどん実現していって、とても重宝しています。いつも更新ありがとうございます！
Twitterで見る デモモードで動作しています。ここでは、作者であるnishishiアカウント以外のツイートの埋め込みはできません。テキストリンクとして掲載は可能ですが、ツイート主が拡散を希望していない可能性がある点にもご配慮下さい。
もう10月……。
画像投稿テスト。
畳む
画像投稿テスト。
畳む
Twitterで見る デモモードで動作しています。ここでは、作者であるnishishiアカウント以外のツイートの埋め込みはできません。テキストリンクとして掲載は可能ですが、ツイート主が拡散を希望していない可能性がある点にもご配慮下さい。
3.8.0リリースありがとうございます！アップデートさせていただきました。
#報告
タグに「_（アンダーバー）」を使うと、投稿欄のプルダウンから選択する時のタグが「［］」つきになってしまいます。
（例）
# test_test で投稿する（説明用の例なのでタグ化しないように半角を入れています）
↓
投稿プルダウンタグ一覧内に追加されるのは『# ［test_test］』になり、それを本文に挿入すると『# ［test_test］』になる
（［］つきで投稿しても一応同一タグとしては認識されるもよう）
日本語の場合、アンダーバーが入った時点でタグが切れるので、英数字タグのみの現象かと思われます。
微細なことなのでそこまで支障はないのですが、一応ご報告させていただきました。
#報告
タグに「_（アンダーバー）」を使うと、投稿欄のプルダウンから選択する時のタグが「［］」つきになってしまいます。
（例）
# test_test で投稿する（説明用の例なのでタグ化しないように半角を入れています）
↓
投稿プルダウンタグ一覧内に追加されるのは『# ［test_test］』になり、それを本文に挿入すると『# ［test_test］』になる
（［］つきで投稿しても一応同一タグとしては認識されるもよう）
日本語の場合、アンダーバーが入った時点でタグが切れるので、英数字タグのみの現象かと思われます。
微細なことなのでそこまで支障はないのですが、一応ご報告させていただきました。
絵文字も使える。プリン！プリン！プリン！ただ絵文字はたぶん1文字4バイトなのでラベルにできるのは最大25文字。畳む
プリン食べたい……。🍮🍮🍮
🍮続きを読む機能でボタンラベルを動的に指定できる機能(※未配布)の動作テスト。🍮プリン！🍮プリン！🍮プリン！畳む ラベル内に改行や装飾や角括弧は含められませんが、任意のラベルをその都度指定できます。みたいな感じで指定したり畳む、みたいな感じで注釈を書いたり畳むいろいろ使えそうな気がします。
ラベルの長さ制限
隠されている範囲内に半角コロン記号がたまたま含まれていたときに、めちゃくちゃ長いラベルになってしまうのを防ぐために、ラベルは最大100バイト（＝UTF-8だと日本語文字なら33文字くらい）に制限してあります。
畳む この機能はOFFにも設定できますから、過去に隠した範囲内で半角コロン記号がたくさん出てきている場合で修正が面倒な場合には、設定でOFFにすれば良いと思います。デフォルトでONにするかOFFにするか迷ったのですが、まあ設定からOFFにできるので、デフォルトではONにしようかな……と思っています。なお、ラベルを指定する部分に
このように
改行が
含まれていれば:それはラベルとしては採用されません畳む。その場合は、設定画面から設定してある文字列(デフォルトでは「続きを読む」)がラベルに使われます。
🍮Re:3083◆絵文字がまだ日本環境でしか使われていなかった時代に、ケータイ各社が柿の絵文字も定義してくれていたらそのままUnicodeに捻じ込まれて良かったんですけどね……。(´･ω･`)
🍮続きを読む機能でボタンラベルを動的に指定できる機能(※未配布)の動作テスト。🍮プリン！🍮プリン！🍮プリン！畳む ラベル内に改行や装飾や角括弧は含められませんが、任意のラベルをその都度指定できます。みたいな感じで指定したり畳む、みたいな感じで注釈を書いたり畳むいろいろ使えそうな気がします。
ラベルの長さ制限
隠されている範囲内に半角コロン記号がたまたま含まれていたときに、めちゃくちゃ長いラベルになってしまうのを防ぐために、ラベルは最大100バイト（＝UTF-8だと日本語文字なら33文字くらい）に制限してあります。
畳む この機能はOFFにも設定できますから、過去に隠した範囲内で半角コロン記号がたくさん出てきている場合で修正が面倒な場合には、設定でOFFにすれば良いと思います。デフォルトでONにするかOFFにするか迷ったのですが、まあ設定からOFFにできるので、デフォルトではONにしようかな……と思っています。なお、ラベルを指定する部分に
このように
改行が
含まれていれば:それはラベルとしては採用されません畳む。その場合は、設定画面から設定してある文字列(デフォルトでは「続きを読む」)がラベルに使われます。
🍮Re:3083◆絵文字がまだ日本環境でしか使われていなかった時代に、ケータイ各社が柿の絵文字も定義してくれていたらそのままUnicodeに捻じ込まれて良かったんですけどね……。(´･ω･`)
>>3080 ありがとうございます！おっしゃる通り、いいねボタンのphpを導入しておりました。
とても助かりましたm(__)m
絵文字は、🦪は有るんですが、柿はないんですよね…。
とても助かりましたm(__)m
絵文字は、🦪は有るんですが、柿はないんですよね…。
3.8.0アップデートさせていだきました！
ありがとうございます！
てがろぐのホームを読み込もうとすると、
お使いのサーバーでPHPが利用できるか確認して下さい。
といったダイアログがでるようになってしまったのですが、調べても出てこず…
どのように対策をしたら良いでしょうか？
OKボタンのようなものをひたすら連打すると読み込まれて正常に動作はします。
サーバーは、さくらのライトプランになります。
何卒よろしくお願い申し上げます。
ありがとうございます！
てがろぐのホームを読み込もうとすると、
お使いのサーバーでPHPが利用できるか確認して下さい。
といったダイアログがでるようになってしまったのですが、調べても出てこず…
どのように対策をしたら良いでしょうか？
OKボタンのようなものをひたすら連打すると読み込まれて正常に動作はします。
サーバーは、さくらのライトプランになります。
何卒よろしくお願い申し上げます。
アップデートお疲れ様です！早速最新版にしました。リリースノートも充実ぶりがすごくて、とても助かっています。本当にお疲れ様です…！そしてありがとうございます！#感謝
以下は #要望 です。
[リンクラベル:LB]についてですが、現時点だとどのライトボックスを使っていても「data-lightbox="tegalog"」が付与されるようになっているみたいなので、【投稿本文の表示／画像】にある「画像リンクに独自のclass属性値を追加する」と同じclass属性値を追加できるようにならないでしょうか？[リンクラベル:LB]機能でも独自のclass属性で、自分が使っているライトボックスで表示をさせたいです。もし可能でしたらよろしくお願いします。
以下は #要望 です。
[リンクラベル:LB]についてですが、現時点だとどのライトボックスを使っていても「data-lightbox="tegalog"」が付与されるようになっているみたいなので、【投稿本文の表示／画像】にある「画像リンクに独自のclass属性値を追加する」と同じclass属性値を追加できるようにならないでしょうか？[リンクラベル:LB]機能でも独自のclass属性で、自分が使っているライトボックスで表示をさせたいです。もし可能でしたらよろしくお願いします。
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 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133
