*Essence

HP用フリー素材とFC2共有テンプレートを作成・配布しています。

 

youth_resp のカスタマイズ(トップ画像表示・非表示)

youth_resp のカスタマイズ(トップ画像表示・非表示)

テンプレート youth_resp 2c,3c のトップ画像の変更方法です。表示領域のサイズに合わせて画像が拡大・縮小されるので、スマートフォンやタブレットなど 端末に合わせた表示が出来ます。お持ちになっている画像に簡単に変更できますが、その前に…。(トップ画像の変更方法は、背景色(背景画像)変更と併せて次の記事に掲載致します。m(__)m)このテンプレートのトップに表示されている画像は、記事本編(個別のページ・パーマリン...

... 続きを読む

テンプレート youth_resp 2c,3c のトップ画像の変更方法です。
表示領域のサイズに合わせて画像が拡大・縮小されるので、スマートフォンやタブレットなど 端末に合わせた表示が出来ます。
お持ちになっている画像に簡単に変更できますが、その前に…。
(トップ画像の変更方法は、背景色(背景画像)変更と併せて次の記事に掲載致します。m(__)m)

このテンプレートのトップに表示されている画像は、記事本編(個別のページ・パーマリンク)に表示されないように作成しております。
そして、エントリーページ以外の「全部のページで要らない」や「全部のページに付ける」という事も出来ます。
ご希望のイメージに合うよう、是非カスタマイズしてみて下さい。(^-^)


1) トップ画像を全てのページで表示させない。
2) トップ画像を全てのページで表示させる。



1) トップ画像を全てのページで表示させない。
画像の無い、シンプルなテンプレートになります。暗色テーマでも表示されなくなります。
トップ画像非表示
↑トップページ(画像無し・要約表示)こんな感じに。

改変する箇所はホンのちょっとだけです。
HTML編集枠を少し下にスクロールした所に下記のような部分が有ります。

<div id="content">
<!--not_permanent_area-->
<div class="topimg"></div>
<!--/not_permanent_area-->
<header class="header<!--permanent_area--> page-header<!--/permanent_area-->">
<h1 id="blog-name"><a href="<%url>"><%blog_name></a></h1>
<div class="introduction"><p><%introduction></p>
</div>
</header>

これを下記画像のように『薄い赤部分』を削除します。(クリックで大きく表示)
トップ画像非表示2
すると、下記のような形になります。(下記をそのままコピペでも可)

<div id="content">
<header class="header page-header">
<h1 id="blog-name"><a href="<%url>"><%blog_name></a></h1>
<div class="introduction"><p><%introduction></p>
</div>
</header>


後は更新ボタンを押して適用させて下さい。
不具合が有った時のために、複製を作っておくと安心です。




2) トップ画像を全てのページで表示させる。
今まで通りのテンプレートになります。トップページと同じ画像を、全てのページで見る事が出来ます。
トップ画像表示
↑個別記事ページ(トップ画像有り)こんな感じに。

改変する箇所は上記と同じ場所です。
HTML編集枠を少し下にスクロールした所に下記のような部分が有ります。

<div id="content">
<!--not_permanent_area-->
<div class="topimg"></div>
<!--/not_permanent_area-->
<header class="header<!--permanent_area--> page-header<!--/permanent_area-->">
<h1 id="blog-name"><a href="<%url>"><%blog_name></a></h1>
<div class="introduction"><p><%introduction></p>
</div>
</header>

これを下記画像のように『薄い赤部分』を削除します。(クリックで大きく表示)
トップ画像表示2
すると、下記のような形になります。(下記をそのままコピペでも可)

<div id="content">
<div class="topimg"></div>
<header class="header">
<h1 id="blog-name"><a href="<%url>"><%blog_name></a></h1>
<div class="introduction"><p><%introduction></p>
</div>
</header>


後は更新ボタンを押して適用させて下さい。
不具合が有った時のために、複製を作っておくと安心です。


Theme : 共有テンプレート * Genre : ブログ * Category : カスタマイズ

Comment-open▼ * Comment : (2) * Trackback : (0) |
Re: 呑兵衛あな 様へ * by aki
こちらこそ、いつも有難うございます。m(__)m

No Subject * by 呑兵衛あな
ありがとうございました

Comment-close▲

youth_resp 2c,3c のカスタマイズ(エントリー1列と全文表示)

youth_resp 2c,3c のカスタマイズ(エントリー1列と全文表示)

レスポンシブテンプレート、youth_resp2c(2カラム), youth_resp3c(3カラム)のエントリー表示の変更方法です。共有テンプレートDL時のトップページのエントリー表示は、2・3カラムとも記事毎の要約表示(2列)になっています。これを要約1列表示・全文表示に変更する方法です。1) エントリー記事を2列から1列にする。2) エントリー記事を全文表示にする。1) エントリー記事を2列から1列にする。トップページ、エントリ...

... 続きを読む

レスポンシブテンプレート、youth_resp2c(2カラム), youth_resp3c(3カラム)のエントリー表示の変更方法です。
共有テンプレートDL時のトップページのエントリー表示は、2・3カラムとも記事毎の要約表示(2列)になっています。
これを要約1列表示・全文表示に変更する方法です。

1) エントリー記事を2列から1列にする。
2) エントリー記事を全文表示にする。



1) エントリー記事を2列から1列にする。
トップページ、エントリー記事の並び方を2列から1列に変更するカスタマイズです。
youth-top0c.jpg
ダウンロード時の↑を↓のように変更。画像ボケててスミマセン。m(__)m
youth-top1c.jpg

見本は3カラムですがカスタマイズ箇所は一緒です。

◎ テンプレートの設定画面を開いてHTMLを編集する。
先ず、管理画面左の『テンプレートの設定』 →[youth_resp〇c]のHTML編集枠を開いて1/5程スクロールした所に有る

<!-- 全文・要約表示用HTMLの貼り換え ここから-->
<div class="blog<!--not_permanent_area--><!--not_edit_area--> col_2<!--/not_edit_area--><!--/not_permanent_area-->">

という部分の青い所を削除し、下記のようにして下さい。

<!-- 全文・要約表示用HTMLの貼り換え ここから-->
<div class="blog">


◎ 次に、スタイルシート編集枠内より、下記のようなCSSを探して修正します。
(文字で検索する場合は『Ctrl+Fキー』を押して、表示された小窓に float:right を入れて下さい。すると4ヵ所見つかりますが、変更するのはセレクタが .left になっているもののみ3ヵ所です。)

① スタイルシート編集枠1/4程スクロールした所に有る
.left{
float:right;
width:100%; /* サムネイル画像の幅 */
height:auto;
max-height:145px;
margin-right:0px;
text-align:center;
position: relative;
overflow:hidden;
}
の青い値の部分を下記のようなオレンジの値に変更
.left{
float:left;
width:45%; /* サムネイル画像の幅 */
height:auto;
max-height:145px;
margin-right:10px;
text-align:center;
position: relative;
overflow:hidden;
}

② スタイルシート編集枠1/2程スクロールした所に有る
@media only screen and (min-width:876px) and (max-width:1119px) {
.left{
float:right;
width:100%;
margin-right:0px;
}
}
の青い値の部分を下記のようなオレンジの値に変更
@media only screen and (min-width:876px) and (max-width:1119px) {
.left{
float:left;
width:45%;
margin-right:10px;
}
}

③ スタイルシート編集枠3/5程スクロールした所に有る
.left{
float:right;
width:100%;
margin-right:0px;
}
}
の青い値の部分を下記のようなオレンジの値に変更
.left{
float:left;
width:45%;
margin-right:10px;
}
}

◎ 後は『更新』ボタンを押して適用して下さい。
(不具合が有った時のために、複製を作ってから作業すると安心です。)




2) エントリー記事を全文表示にする。
トップページ、エントリー記事を要約表示から全文表示に変更するカスタマイズです。
youth-top0c.jpg
↑このように変更。画像ボケててスミマセン。m(__)m

◎ テンプレートの設定画面を開いてHTMLを編集する。
先ず、管理画面左の『テンプレートの設定』 →[youth_resp〇c]のHTML編集枠を開いて <!-- 全文・要約表示用HTMLの貼り換え ここから--> という所から <!-- 全文・要約表示用HTMLの貼り換え ここまで--> という所までを、[ Read More ]↓に掲載しているHTMLに変更して下さい(コピー&ペースト)。

Read More

Theme : 共有テンプレート * Genre : ブログ * Category : カスタマイズ

Comment-open▼ * Comment : (2) * Trackback : (0) |
Re: 呑兵衛あな 様へ * by aki
ダウンロード頂き有難うございます。(^-^)
ご利用後に分かる不具合も有りますので、もし見付けられましたらお教え下さいませ。
次のカスタマイズ記事は、トップの画像についてを予定しております。

今後とも宜しくお願い致します。m(__)m

No Subject * by 呑兵衛あな
[youth_resp3c]を拝借します。
早速全文表示にしました。
お疲れさまでした

Comment-close▲

youth_resp 2c,3c 共有化しました。

youth_resp 2c,3c 共有化しました。

本日、申請していたテンプレート [youth_resp3c] [youth_resp2c-r(右メニュー)] [youth_resp-l(左メニュー)] の3点が共有化致しました。この度のテンプレートに使用しているトップ画像は、高校生の姪(idumi)が趣味で撮影した画像を2点、了解をもらって使用しております。イメージとしてはやっぱり『若さ・青春』、テンプレート名そのものデス。^^;爽やか~な青空とJK♪ 広がる明るい未来~みたいな淡色カラーのテーマと、流れ...

... 続きを読む

本日、申請していたテンプレート [youth_resp3c] [youth_resp2c-r(右メニュー)] [youth_resp-l(左メニュー)] の3点が共有化致しました。

この度のテンプレートに使用しているトップ画像は、高校生の姪(idumi)が趣味で撮影した画像を2点、了解をもらって使用しております。
イメージとしてはやっぱり『若さ・青春』、テンプレート名そのものデス。^^;
爽やか~な青空とJK♪ 広がる明るい未来~みたいな淡色カラーのテーマと、流れる雲と空に掲げたカメラ(なんですよ^^;) 今と夢と見えない未来~みたいな暗色カラーのテーマを、右下の◐ボタンを押して切り替える『二度美味しい(?)』テンプレートになっています。
明るい画面で眼がお疲れの時は、是非ダークテーマに切り替えてご覧下さいませ。m(__)m
(また、カスタマイズ次第で『淡色・暗色』では無く、自身の好きな画像と色味で作ったテーマに切り替える事も出来ます。)

このテンプレートに付いているのは『ダークテーマ』への切り替え機能です。
OSの機能『ダークモード』対応というものでは無いので、OSのダークモードで閲覧されている方も初回時は初期テーマである淡色で表示されます。
暗色で閲覧されたい方は、右下にある◐マークをクリックしてテーマを暗色に変更して下さい。
(変更されたテーマは、再度変更されるまで有効になって居ります。)


youth-w3cmyouth-d3cm
youth_resp3c↑1280px以上3カラム,未満2カラム,770px未満1カラム。

youth-w2rmyouth-d2rm
youth_resp2c-r↑770px以上2カラム,未満1カラム。

youth-w2lmyouth-d2lm
youth_resp2c-l↑770px以上2カラム,未満1カラム。

(画像ボケててスミマセン。^^; 是非、共有テンプレートのプレビューで 自身のブログに適用した場合を見て下さい。)

  • 1カラムになるとメニューがドロワー表示になり、ドロワー内のメニューは、他を開くと閉じる仕様です。
  • 2・3カラムとも、記事上に表示されていたプラグイン3は、個別記事画面では記事下に表示され読み易くなります。
  • トップに表示される画像は、個別記事ページには表示されません。
  • 個別記事ページの追記記述部分が展開式になっております。


DLされた方は是非、テンプレートのHTMLとCSSの編集枠内をご覧になって下さい。
カスタマイズし易いようにコメントアウトを付けておりますので、追加したり・削除したり・変更したり、ご自身のお好みに近付ける事が出来ます。
また、ブログ記事にカスタマイズや更新情報なども時々掲載しております。是非併せてご覧下さい。
その際にご不明な点などが有りましたら、どうぞ気兼ね無くお声掛け下さいませ。m(__)m


レスポンシブテンプレートは表示サイズ可変対応になっております。パソコン・タブレット・スマートフォン等での表示のために、以下の設定をして下さい。

1) レスポンシブテンプレートはパソコン・スマホ共通なので設定を変更する。
PCやモバイル端末等の閲覧で、画面サイズが変化するレスポンシブデザインテンプレートを使う場合、初めに「スマートフォン版の表示設定」を変更して下さい。
管理画面左の『環境設定』 → 『ブログの設定』 →『スマートフォン版の表示設定』を無効にして更新。

2) OGPの設定も忘れずに。(環境設定→ブログの設定→メタタグの設定)
レスポンシブ・テンプレートとは関係ありませんが、ランキングサイトやSNSに『記事投稿しているのに画像が表示されない』等の不具合が有った場合は、このOGPの設定がされていない事が原因の場合が有ります。
メタタグの設定 ←ここの【OGP設定】を有効にして下さい。

3) 検索バーはレスポンシブ未対応なので非表示にする。
FC2ブログ上部に有る検索バーはレスポンシブ未対応なので、画面の表示サイズによっては途切れて表示されてしまうため表示を無効にする事をお勧めします。
管理画面左の『環境設定』 → 『ブログの設定』 →『検索バーの設定』で[利用しない]を選択して『更新』。

先ず、上記3点の設定をお願い致します。m(__)m
相変わらずのレガシーデザインですが…気に入って頂けたら使ってやって下さい。m(__)m

Theme : 共有テンプレート * Genre : ブログ * Category : テンプレート

Comment-open▼ * Comment : (8) * Trackback : (0) |
Re: ススム 様へ * by aki
ご訪問頂き 有難うございます。(^-^)
3種申請、無事通りました。
思ってたよりも共有化が遅かったので、「今迄はOKだけどこれからはダメ」…なんて連絡メールが来たらどうしよう?とか心配してました。^^;
皆様のおかげです♪有難うございます♪

昔と違って今は共有申請する人が少なくなって来ましたし(プラグイン然り)、新しいテンプレートのDLの勢いも、以前より無くなって来ているような気がします。
その分、問い合わせも少なくなったような。^^;
質問・不具合以外のコンタクトも来てくれると嬉しいのですが…。

あ、お返事になっていませんね~。失礼しました。m(__)m

承認おめでとうございます * by ススム
こんばんは、akiさん。
新テンプレートが3つとも、無事に承認されて何よりです。
ダウンロード数も順調に伸びで行きそうですね。
また、プレビューでもモードの切替が確認できるのもいいですね。

いろんな方からの質問にも、いつも分け隔てなく丁寧にご回答されているので、新規ユーザーさんも安心だと思いますよ。


Re: 呑兵衛あな 様へ * by aki
お騒がせ致しました。m(__)m
先程記事を掲載致しましたので、宜しければお読み下さいませ。

読み物を書かれる方から、記事本編の画像を外したいとのリクエストが有ったため、画像非表示が簡単になるように作ってみました。
(そのまま画像部分を削除するだけでは、エントリーページも記事ページも崩れてしまうので。^^;)

ご要望を叶えるテンプレートを作るのは大変ですが、悩ましい分楽しいです。
お気付き、いつも有難うございます。m(__)m

Re: aki 様へ * by 呑兵衛あな
>トップに表示される画像は、個別記事ページには表示されません。

本記事にて書かれていましたねv-7
よく読まないで失礼しました。


>『表示する・表示しない』が出来るカスタマイズ方法を書いております。

ぜんぜん慌てませんし...それはそれとして、私の所、私が改造したTPに戻します

Re: 呑兵衛あな 様へ * by aki
申し訳ございません。
カスタマイズ記事のスクリーンショットを作るために、一時、トップ画像の表示方法を変えておりました。
基本形は『個別記事ページはトップ画像が表示されない。』で正しいです。

只今記事で、全てのページでトップ画像を『表示する・表示しない』が出来るカスタマイズ方法を書いております。
混乱させて申し訳ございません。m(__)m

不思議 * by 呑兵衛あな
[youth_resp3c] で、個別記事を表示させた場合、トップ画像が表示されなくなります。
私が改造したTPで気が付きました。
こちらのテンプレートでは表示されるので不思議と思い、改めてDLLし直してみましたが同じ症状です。
念のため[youth_resp2c-r]をDLLしてみましたが、同様でした。
ご確認いただき、御教授いただきたくお願いします。
現在、私の物には[youth_resp3c] のDLLしたままのTPが設置してあります。

Re: ぼっちん 様へ * by aki
コメント頂き有難うございます。(^-^)

ダウンロードも削除も簡単ですから、サブで是非、色々遊んでみて下さい。
行く行くはご自身で作成…するのでしょうし。練習に如何ですか?(^_-)-☆
古い技術で作ったものを、新しいアイディアとインスピレーションで改変したら、異なる素敵なものが出来そうです♪

良いですねぇ♪ * by ぼっちん
新テンプレート3点の共有公開、おめでとうございます ^^

良いなぁ「使いた~~~い♪」と食指がウズウズしますぅ (^_^; アハハ…

lazyloadを追加して、あれも追加して、これも追加して、、、(爆)
ああ、悩むぅぅぅ (^_^; アハハ…

Comment-close▲

共有テンプレート申請しました。

共有テンプレート申請しました。

本当は2/7に一度申請したんですが、ちょっとした修正箇所を見付けたので取り下げて、本日再申請致しました。が、いつ共有化するかは分かりません…。^^;共有化する前に先ずはお披露目を。(^^ゞ 見本はこのブログです。暗色テーマ付きなので、是非変更してみて下さい。(右下の◐クリックで切り替わります。)もし、テンプレートの不具合に気付かれた方がいらっしゃいましたら、コメントでもメールでも結構なので、何なりとご連絡下さ...

... 続きを読む

本当は2/7に一度申請したんですが、ちょっとした修正箇所を見付けたので取り下げて、本日再申請致しました。
が、いつ共有化するかは分かりません…。^^;
共有化する前に先ずはお披露目を。(^^ゞ 見本はこのブログです。
暗色テーマ付きなので、是非変更してみて下さい。(右下の◐クリックで切り替わります。)
もし、テンプレートの不具合に気付かれた方がいらっしゃいましたら、コメントでもメールでも結構なので、何なりとご連絡下さいませ。

2カラム左右と3カラムの3種を申請致しました。
問題が無ければ近日共有化致します。先ずは予告まで。


Theme : 共有テンプレート * Genre : ブログ * Category : テンプレート

Comment-open▼ * Comment : (20) * Trackback : (0) |
Re: 呑兵衛あな 様へ * by aki
無事に解決したとの事、安心しました。(;´∀`)
私が確認できずにモヤモヤしたまま共有化してしまうのは嫌だったので、呑兵衛あな様がご自身で表示される事を確認して頂けて良かったです。

また何かお気付きの点がございましたら、何なりとお声掛け下さいませ。m(__)m

Re: aki 様へ * by 呑兵衛あな
>ダメモト・・・の件
大いにガッテンです。

あと「3カラムで表示」の件です。
『画面の最大化』と言われる事をガテンしました。FirefoxでもChromeでも私は『いつでも最大化した画面』しか見ていません。
私は1366x768 ピクセルのNECノートパソコンを使っています。ですから、仰る環境には達していると思うのですが...いずれにしても、[youth_resp3c] はこちらでしか体験していませんので...共有された後で弄ってみるとしか言いようがないのですが。

追伸(後で編集)
恥ずかしながら、自己レス...解決しました。
Firefoxの画面でズームアップ(110%)していた事に気が付きませんでした。
100%にしたところ、3カラム表示されました。
お騒がせしました

Re: 呑兵衛あな 様へ * by aki
お早いお返事を有難うございます。m(__)m

当方の手持ちPC(デスクトップ・ノート)&ブラウザで新旧のFirefoxを試してみているのですが、ディスプレイ解像度(1280×〇)で全て3カラムで表示されております。
なので、2カラムで表示される理由が…分かりません。m(__)m
大変お手数なのですが、今一度『画面の最大化』(言い方を変えました。)をしてみて頂けますか?
https://blog-imgs-133.fc2.com/s/o/r/sorauta1/firefox-button.gif
Firefoxの画面で言うと(ご存知でしょうが)このボタンです。
画像は下記からお借り致しました。
https://support.mozilla.org/ja/kb/what-happened-to-the-file-edit-and-view-menus

2カラムと3カラムの違いで抜け落ちるものが有る訳では無いですが、2019年のモニター解像度のシェアで横幅1280px以上が約65%と圧倒的なので、このサイズを基準にしております。

>ダメモト・・・
の件ですが、日本語表記と仰られる部分は、大変申し訳ございませんがご自身でお直し頂くようお願い致します。
FC2ブログの利用者は日本人ばかりでは無いので、見易いフォント・分かり易い単語のみで英語表記にしております。(私自身は英語話せませんが。^^;)
ご理解頂けます様お願い致します。m(__)m

Re: そふぃあ 様へ * by aki
ご訪問頂き有難うございます。m(__)m

OSベースでダークモードを設定していらっしゃる方には、選択するより始めから暗い方が良いのでしょうが…
如何せん^^;、IEや古いバージョンのブラウザで閲覧されている方にも利用できるテンプレートとして作ってるものですから、見送っている新しい技術も色々有りまして。
この度の『選択できる暗色』もその一つなんですよ。

…本当は、頭が古い・スキルが無い言い訳、なんですけどね。(^^;

Re: aki 様へ * by 呑兵衛あな
>Firefoxの全画面表示で今一度ご確認頂けますか?

私、全画面表示でしかFirefoxの使い方を知りません....という事で、ご指導の意味に理解が及びません。


>ダメモト・・・

の件、厚かましくも述べさせていただきます。
以下の記事は、私が「ct_responsive3c」テーマをアレンジする際の防備として書いたものです。
https://nonn63400.blog.fc2.com/blog-entry-10.html

あと、コメントの投稿欄周りと、個別記事下部にある看板を日本語化しています。

最終更新日 : 2020-01-08
* カティゴリ :
* コメント : (0) * トラックバック : (0)



こんばんは * by そふぃあ
自分で背景色を選べるって画期的ですね。
おまけに、読みやすいし使いやすそうです。
皆さんからの反響も上々!
共有されるのが楽しみです。

Re: 呑兵衛あな 様へ * by aki
このテンプレートは、申請中の3カラムタイプのものですが、ブラウザの横幅1280px以上3カラム,未満2カラム,750px未満1カラムに変化します。
ひょっとしてスクロールバーの分かなぁ?と思ったのですが、ブラウザによってスクロールバーの幅は多少違えども、ほぼ17pxで網羅できるので同じ表示をすると思うのですが…Firefoxの全画面表示で今一度ご確認頂けますか?
もしそれでも2カラムになってしまうようでしたら、3カラムになる表示幅を10px位減らしてみます。

ダメモト・・・のお話ですが、一応、古臭いデザインだけれどtransform可能というのが『売り』なので(^^;)、この度も『全文表示』と『要約部2列→今迄のような1列』へのカスタマイズが出来るように制作しております。
それと、『日本語表記』とはどの部分の事でしょう?

共有化するまでの間に出来るだけ不具合を修正しておきたいと存じますので、早いお返事を頂けると幸いです。m(__)m

Re: aki 様へ * by 呑兵衛あな
>◐ボタンで出来ます。(右の下方にマークが表示されます)

「◐ボタン」、見つけました(笑)
あと奇妙な事に気が付きました。私はFirefox・Chrome・新Edgeを利用しています。
こちらのブログにFirefoxでアクセスすると2カラム、他の2つでは3カラムで表示されます。フッターは[youth_resp3c]と表示されていますが...不思議。
ダメモトで書きますが、全文表示と日本語表記が欲しい爺でした。

Re: やぴこ 様へ * by aki
こんにちは。(^-^)
いえいえ、感想を頂けるのはとても有難い事です。
印象や使ってみて思った事など、お教え頂けると助かりますので、幾らでも来て下さいね♪

p.s. バレンタインテーマの次はどんな風になるのか…やぴこ様のブログを見るのは楽しいです。(^-^)

再び… * by やぴこ
そうですね、
PCでも変わってますよね…
(オオオーッ!もう一回やってきましたよ😆)

姪っ子ちゃんの撮った二枚の写真
青春って、若さって、スバらしいですね(*^^*)
お話が聞けて嬉しいです✨

感想文みたいなことしか書けませんが、記事が更新されてると ついふらふら~っと来たくなってしまいます

Comment-close▲

テンプレートの修正・更新致しました。20/02/01

テンプレートの修正・更新致しました。20/02/01

いつもテンプレートをご愛顧頂き、有難うございます。本日、ユーザー様よりご指摘の有った「serene-resp2c(2カラム)のトップページ要約表示」カスタマイズ時の更新エラーを修正し、テンプレートの更新を致しました。参照カスタマイズ記事『serene_resp 2c,3c のカスタマイズ(エントリー要約表示)』修正が必要なのは左右2カラムのもので、3カラムは2019/12/24に修正済みです。本日以前(テンプレートのCSS上部に記述して有る更...

... 続きを読む

いつもテンプレートをご愛顧頂き、有難うございます。
本日、ユーザー様よりご指摘の有った「serene-resp2c(2カラム)のトップページ要約表示」カスタマイズ時の更新エラーを修正し、テンプレートの更新を致しました。

参照カスタマイズ記事
serene_resp 2c,3c のカスタマイズ(エントリー要約表示)
修正が必要なのは左右2カラムのもので、3カラムは2019/12/24に修正済みです。
本日以前(テンプレートのCSS上部に記述して有る更新日20/02/01以前)の2カラムタイプのHTMLが下記のようになっているため、カスタマイズ記事通りのコピー&ペーストを行うと、FC2独自のエリアタグが重複してしまい、更新しようとするとエラーが表示されます。

「20/02/01以前のHTML内修正箇所」
<div class="blog">
<!--not_category_area--><!--not_date_area--><!--not_tag_area-->
<!-- 全文表示用HTMLの貼り換え ここから--> ←ここ以下にカスタマイズソースを貼り付けると…
<!-- トップページ ここから-->
<!--topentry-->
~~~~以下続く~~~

<div class="blog">
<!--not_category_area--><!--not_date_area--><!--not_tag_area-->

<!-- 全文表示用HTMLの貼り換え ここから-->
<div class="blog">
<!--not_category_area--><!--not_date_area--><!--not_tag_area-->
 ←紫部分赤部分が重複してしまい更新エラーになる
<!-- トップページ ここから-->
<!--topentry-->
~~~~以下続く~~~

なので、カスタマイズ用のHTML貼り付け位置を一番上からに変更して下記のようにする。
(若しくは貼り付けた後に重複する上2段を削除する。)

<!-- 要約表示用HTMLの貼り換え ここから-->
<div class="blog">
<!--not_category_area--><!--not_date_area--><!--not_tag_area-->
<!-- トップページ ここから-->
<!--topentry-->
~~~~以下続く~~~


以前の修正時に、カスタマイズソース挿入案内用のコメントアウトの位置が修正されておりませんでした。
本日の更新で、テンプレート『serene-resp2c(2カラム)』のHTMLコメントアウト位置は修正されております。
大変ご迷惑をお掛け致しました。そして、ご報告頂いたユーザー様、誠に有難うございました。m(__)m

Theme : 共有テンプレート * Genre : ブログ * Category : テンプレ修正等

Comment-open▼ * Comment : (7) * Trackback : (0) |
管理人のみ閲覧できます * by -

Re: s 様へ * by aki
コメント頂き有難うございます。
そちらにお返事致しました。(^-^)

管理人のみ閲覧できます * by -

Re: s 様へ * by aki
コメント頂き有難うございます。
そちらにお伺い致しますね。(^_^)

管理人のみ閲覧できます * by -

Re: s 様へ * by aki
コメント頂き有難うございます。
そちらでお返事致しますね。(^_^)

管理人のみ閲覧できます * by -

Comment-close▲

テンプレートの修正・更新致しました。20/01/14

テンプレートの修正・更新致しました。20/01/14

いつもテンプレートをご愛顧頂き、有難うございます。本日、下記テンプレートのコメント投稿部分のHTMLを修正・更新を致しました。暗色系のカスタマイズをされている方のみ、コメント投稿部をクリックして修正が必要かをご確認下さいませ。m(__)m当方のテンプレートは、コメント等の入力欄にクリックでフォーカスを当てると、テキスト入力欄の背景色が変わるようになっていました。通常の使用では問題有りませんが、カスタマイズ等...

... 続きを読む

いつもテンプレートをご愛顧頂き、有難うございます。
本日、下記テンプレートのコメント投稿部分のHTMLを修正・更新を致しました。
暗色系のカスタマイズをされている方のみ、コメント投稿部をクリックして修正が必要かをご確認下さいませ。m(__)m

当方のテンプレートは、コメント等の入力欄にクリックでフォーカスを当てると、テキスト入力欄の背景色が変わるようになっていました。
通常の使用では問題有りませんが、カスタマイズ等で入力欄が淡色から暗色へ変更になった場合(暗色CSSのカスタマイズを含む)、HTML内に直接記述して有るソースの背景色が邪魔をして文字色が見えないというお話を、他所にて拝見致しました。
そのため、本日CSS側のカスタマイズを反映させるよう、HTML内に有るコメント投稿部とコメント修正部に有るソースを全て削除致しました。
(HTML内の onblur="~~からbackgroundColor='#xxxxxx';" までの部位12ヵ所と、トラックバックにも1ヵ所ある場合有り。)

テンプレートの暗色カスタマイズをされている方、配布しているカスタマイズCSS 『着せ替えnightscape』 を適用されている方で、コメント投稿枠をクリックした際に色が淡色に変わった方は、適用テンプレートの編集画面を表示した状態で キーボードの「Ctrl + Fキー」を押して検索窓を出し、その中に onblur と入れて場所を確認し、onblur="~~からbackgroundColor='#xxxxxx';"までを全て(12ヵ所、若しくは13ヵ所。全てまとまった所に記述されていますので、検索ですぐ分かります。)を削除して下さい。

genial_resp2c,3c
serene_resp2c,3c
ct_responsive
al_responsive
candy,green-2c3c
lace-al2,al3
lace-d2c,d3c
dt21_ryo,ryo_2c

お手数をお掛け致しますが、宜しくお願い致します。m(__)m

閲覧頂いている皆様へ
只今、テンプレートのダークモード変更scriptの動作検証と、Search(検索)scriptの使用許諾をメールで問い合わせしております。
右上の『Search』と『◐』をクリックして、動作等の不具合が無いかお教え頂けると有難いです。


Theme : 共有テンプレート * Genre : ブログ * Category : テンプレ修正等

Comment-open▼ * Comment : (4) * Trackback : (0) |
Re: 徳川たぬこ 様へ * by aki
コメント有難うございます。m(__)m
正しく学んだ事が無いのでソース内にエラーが…まだちょっとお披露目は早いかなぁ~・・(;´・ω・)
次のテンプレートくらいに付けたいのになぁ。。

…ってかいつになるやら、です。^^;

No Subject * by 徳川たぬこ
そうなのですか!? サーチも超便利ですね
(°∇°) そちらもぜひ使ってみたいです!
親切設計のakiさんテンプレートが更に使いやすくなるとは♪超楽しみでございます

気長に実装をお待ちしております♪


製作者様~~~
ご許可を~~~~~
(*゚ノO゚)

Re: 徳川たぬこ 様へ * by aki
動作確認、有難うございます。m(__)m
IEやEdgeにも対応できるように色々試行錯誤しております。
まだ時々調整を入れておりますので、お披露目にはちょっと時間が掛かるかも…
夜のスマホ表示とかで良いかな~と思います。

search(検索)は、コメント者の名前からも記事検索できるので、いつ自分がどんなコメントをしたか探せますよ。
ただ、source製作者様からのコメント及びメールの返事が10日経っても来ない…(-_-;)

『Search』と『◐』の件 * by 徳川たぬこ
・windows7(近々バージョンアップ予定)、 chrome
・スマホiphone6plus 
safari

問題なく動作いたしました
修正お疲れ様です

ダークモード、カッコいいですね!使ってみたいです

Comment-close▲