12345678910111213141516171819202122232425262728293031
個別記事の管理2019-08-19 (Mon)
2019/08/19 の更新で、レスポンシブタイプ8種 2カラム及び3カラムのスタイルシート内に有る reset css を修正・更新致しました。

ユーザー様からのお問い合わせで、<strong>タグ内に入れ子で文字の色や大きさ等を指定する<span>タグを使用すると、その部分だけ<strong>が効かなくなる旨の不具合報告を頂きました。
調べてみましたら、テンプレートのスタイルシート上部に有ります
/* -----reset css------ */
以下の、セレクタ span に掛かる
font-weight:normal;
が原因であることが分かり、本日修正及び更新致しました。
ご利用の皆様には大変ご迷惑とお手数をお掛け致しますが、下記のように修正・更新の程をお願い致します。

テンプレートスタイルシート枠内最上部に有る
/* -----reset css------ */
以下の5行目(テンプレートにより前後1行の差が有ります)
font-weight:normal; の文字を見付けて削除
もう一ヵ所、
reset css の最終行の後に下記を追加(↓このように。)
~省略~section,summary{display:block;}h1,h2,h3,h4{font-weight:normal;}



'19/08/21 修正方法を変更致しました。(共有テンプレートは修正・更新済み)
1) テンプレートスタイルシート枠内最上部に有る
/* -----reset css------ */
以下の1行目に有るセレクタ名を削除して下さい。
span, small, b, i, em, strong, ←左記6種のセレクタ名をカンマ( , )ごと削除。

ここで更新ボタン、でも問題無く使えますが、上記を削除したためにページの下段に表示されるページネーションの表示が少し変わります。

現在表示されているページの番号の枠が下にちょっと伸びてしまう形状に…。ここ!という目印にはなります。^^;

2) この枠を修正する場合はお手数ですがもう一点、同じくスタイルシート編集枠内中程から3/5程の所と かなり下の所に『#pagenavi span』という箇所が3か所有ります。(キーボード「Ctrl+Fキー」で検索窓が出ますので、その中に #pagenavi span と入れて検索。)
そのセレクタ内にある高さの部分、『 height:○px; 』 を削除して下さい。〇の数値部分はテンプレートによって異なります。また、『 height:○px; 』 が無いものも有ります。その場合はそのまま飛ばして下さい。

以上です。後は更新ボタンを押して下さい。
(ReadMoreに修正後の reset css を掲載致しましたので、そのまま貼り換えして頂く事も出来ます。)

【リンク】 お問い合わせとその返信です。
ご連絡頂き、有難うございました。m(__)m

[該当テンプレート]
genial_resp2c,3c
serene_resp2c,3c
ct_responsive
al_responsive
candy-2c3c
green-2c3c
lace-al2,al3
dt21_ryo,ryo_2c



テンプレートのスタイルシート枠内上部に有る reset css を貼り換えて『更新』して下さい。

/* -----reset css------ */
html,body,address,h1,h2,h3,h4,h5,h6,dl,dt,dd,ol,ul,li,div,p,pre,blockquote,hr,bdo,a,br,del,ins,abbr,dfn,sub,sup,q,cite,code,var,kbd,samp,map,area,iframe,img,form,label,fieldset,legend,input,textarea,select,option,optgroup,button,command,details,menu,summary,article,aside,header,footer,nav,section,figcaption,figure,main,mark,rp,rt,ruby,time,wbr,audio,canvas,embed,object,param,source,video,datalist,keygen,meter,output,progress{margin:0;padding:0;border:0;outline:0;font-size:100%;font-weight:normal;vertical-align:baseline;list-style-type:none;background:transparent;box-sizing:border-box;}embed,iframe,img,table,textarea{max-width:100%;}table{border-collapse:collapse;border-spacing:0;}a,a:link,a:visited{color:#333;text-decoration:none;}a:hover,a:active{color:#777;}article,aside,canvas,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block;}
/* ---reset css end----2019/08/20更新 */


各テンプレート共通です。上記に貼り換えて、更に記事内の2)を行って下さい。
お手数をお掛け致しますが、修正・更新の程 宜しくお願い致します。m(__)m

Return

Theme : 共有テンプレート * Genre : ブログ * Category : テンプレ修正等
* Comment : (6) * Trackback : (0) * |

Re: どなるど 様へ * by aki
何度もお手数をお掛け致します。m(__)m
セレクタを削除した事でちょっと崩れたみたいですね。
一番下までスクロールして確認すれば良かった…。ご指摘有難うございます。

先程記事を少し修正・更新致しました。(共有テンプレも更新しました。)
1)で、削除セレクタが一つ増えています。1行目のemも削除して下さい。
2)に書いてある部分を、お手数ですが適用してみて下さい。
本当に…いつも確認して頂き、有難うございます。(;^_^A

Re: - 様へ * by aki
お返事はそちらにお伺い致しますね~。(^_^)

またまたスミマセン。。 * by どなるど
akiさん、またまた今晩は。
晴れたり曇ったりと落ち着かない天気ですね(^-^;

reset css を全コピペしてみました。
ところが…今度はブログの下の方にある
ページを移動するボタンが見た目ちょっとだけ
変わってしまいました。
(見た目だけで使用するのには問題ありません)

↓こんな感じです。
https://blog-imgs-128.fc2.com/l/e/c/lechat5/201908211610123ad.jpeg

私の環境だけかもしれませんが、確認お願いしますm(_ _)m

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

Re: どなるど 様へ * by aki
早速検証頂き 有難うございます。
そして、お手数をお掛けして申し訳ございません。m(__)m

更新したテンプレートは、ブログタイトル部分も font-weight:normal に修正したのですが、既にDLされた方の修正(記事)では、まとめて reset css 内に入れた方が分かり易くて簡単かな、と。^^;
見出しタグである<h1>や<h2>等でマークアップした部分は、そのままだと太字になるので、一度 reset css から外して、他のセレクタと干渉しないよう 最後に記述(font-weight:normal;)。
その後述で、太字・細字をcssで再設定、という形を取っております。


reset css を少し見直しました。^^;
方法は違いますが結果は同じことになるので、そのままでも問題有りません。

もし変更される場合は、追加して頂いたタイトル部のスタイルはそのままで結構ですので、ReadMoreにある reset css に貼り換えして下さい。
度重なる修正で、本当に申し訳ございません。m(__)m

p.s. いや~、せめて興奮して噛みつくのはやめて欲しい…猫の話、ですけどね。
まだ流血まではして無いですが、それは彼なりの手加減(口加減?)なのか…薄着の夏場はやめて…お願い…な気持ちです。(;^_^A

修正してみたら… * by どなるど
akiさん、今晩は(^-^)
TVではそろそろ暑さも落ち着いてくると言ってましたが、
暑いですね(^^;)

投稿通りに修正&更新してみたら…
んっ?!ブログタイトルが太くなっちゃった〜( ̄。 ̄;)
ので、最新のテンプレートをDLして比較してみたら
CSSのタイトル部分のところに
【font-weight:normal;】が追加されてたので
同じように追加して更新したら直りました(*^^*)

というご報告ですm(_ _)m

p.s.猫のはなちゃんの運動会もスゴそうですね。
多頭飼いになると…大運動会になりもっとウルサクなります(笑)
ウチはもうシニアなので運動会はしなくなりましたけどね(遠い目)

個別記事の管理2019-08-12 (Mon)
レスポンシブテンプレート、genial_resp 3c(3カラム), 2cr(2カラム右), 2cl (2カラム左)の記事表示の変更方法です。
共有テンプレートDL時のトップページのエントリー表示は、2・3カラムとも記事毎の要約表示になっています。
これを全文表示に変更する方法です。

◎ テンプレートの設定画面を開いてHTMLを編集する。
管理画面左の『テンプレートの設定』 →[genial_resp〇c]のHTML編集枠を開いて <!-- 全文表示用HTMLの貼り換え ここから--> という所から <!-- 全文表示用HTMLの貼り換え ここまで--> という所までを、下記↓に掲載しているHTMLに変更して下さい(コピー&ペースト)。
('19/8/12以前の2カラム版が、間違えて<!-- 要約表示用HTMLの~ になっておりましたので、同日 正しく修正・更新致しました。m(__)m)


<!-- 全文表示用HTMLの貼り換え ここから-->
<div class="blog">
<!-- トップページ ここから-->
<!--topentry-->
<article class="blog-con blog-con2">
<span class="tape t-right"><%topentry_year>-<%topentry_month>-<%topentry_day> (<%topentry_youbi>)
<!-- 投稿時間不要の場合は ここから-->
<!--permanent_area--> <%topentry_hour>:<%topentry_minute><!--/permanent_area-->
<!-- 投稿時間不要の場合はここまでを削除 -->
<a href="<%server_url>control.php?mode=editor&process=load&eno=<%topentry_no>" target="_blank" rel="noopener"><span class="pen-link">✎</span></a>
</span>
<div class="entry_title"><h2 id="entry<%topentry_no>"><a href="<%topentry_link>"><%topentry_title></a></h2></div>
<!--not_edit_area--><!--not_titlelist_area--><!--not_search_area--><!--not_permanent_area-->
<div class="kiji1"><!--kiji1-->
<div class="con_body">
<div class="left">
<a href="<%topentry_link>" title="<%topentry_title>"><img src="https://blog-imgs-124.fc2.com/s/o/r/sorauta1/10pxtp.png" data-src="<%topentry_image_url>" alt="<%topentry_title>" onerror="this.src='https://blog-imgs-123.fc2.com/s/o/r/sorauta1/1-1.gif';"></a>
</div>
<div class="right">
<div class="text_overflow">
<p class="moji-c"><%topentry_description></p>
</div>
</div>
</div>
<p class="right-txt"><a href="<%topentry_link>">… 続きを読む</a></p>
</div><!--/kiji1-->
<!--/not_permanent_area--><!--/not_search_area--><!--/not_titlelist_area--><!--/not_edit_area-->
<div class="con_body pd-plus<!--not_edit_area--><!--not_titlelist_area--><!--not_search_area--><!--not_permanent_area--> kiji2<!--/not_permanent_area--><!--/not_search_area--><!--/not_titlelist_area--><!--/not_edit_area-->">
<%topentry_body>
<!--more_link-->
<p><a href="<%topentry_link>#readmore">Read More</a></p>
<!--/more_link-->
<!--more-->
<p id="readmore" style="padding-top:1.8em;margin-top:-3em;margin-left:-5px;">​</p>
<!-- 記事ページの追記開閉が不要の場合はここから削除 -->
<!--permanent_area-->
<div class="hidden_box" style="margin-top:0;">
<input type="checkbox" id="navTgl">
<label for="navTgl" class="open">Read More</label>
<div class="hidden_show"><%topentry_more>
<label for="navTgl" class="close">Close</label>
</div>
</div>
<!--/permanent_area-->
<!-- 追記開閉が不要の場合はここまでを削除し、この部分に<%topentry_more>(全角山括弧を半角に変更して)を入れる -->
<!--/more-->
</div>
<!-- 全文表示用HTMLの貼り換え ここまで-->



上記を貼り換え・更新して頂くだけでトップページが全文表示になりますが、表示する画面サイズが420px未満で要約表示に変わります。
これは、小さい画面での縦スクロールが長くなってしまい、操作性が悪くなってしまう・次の記事を選択し難くなる、等を防ぐために画面サイズで切り替えしているためです。
この部分も全文表示にしたい場合は、下段のスタイルシート編集枠かなり下までスクロールすると
@media only screen and (max-width:420px) {
という部分が有りますので、それ以下に有る
.kiji1{
display:block; /* 1カラム時要約表示 */
}
.kiji2{
display:none; /* 1カラム時記事非表示 */
}

という部分を
.kiji1{
display:none; /* 1カラム時要約非表示 */
}
.kiji2{
display:block; /* 1カラム時全文表示 */
}

に変更して更新ボタンを押して下さい。


◎ 全文表示カスタマイズを行った場合は、カテゴリー別や月別のアーカイブも全文表示(指定表示件数分)の表示になってしまいますので、下記カスタマイズも是非行って下さい。
カテゴリー別及び月別のアーカイブをリスト化

カスタマイズを行う場合は、テンプレートの複製を作成してからの作業が安心です。
Theme : 共有テンプレート * Genre : ブログ * Category : カスタマイズ
* Comment : (0) * Trackback : (0) * |
個別記事の管理2019-08-10 (Sat)
テンプレート genial_resp 2c,3c のトップ画像の変更方法です。

表示領域のサイズに合わせて画像が拡大・縮小されるので、スマートフォンやタブレットなど 端末に合わせた表示が出来ます。
画像をレスポンシブ対応させる方法は幾つか有りますが、パーセント指定と background-size:cover; を使った方法です。
background-size:cover; は、画像の幅と高さの比率を固定して領域を覆うように表示し、はみ出した部分を非表示にします。

テンプレートの管理画面下段の [ genial_resp〇c ] のスタイルシート編集枠内
スクロールすると1/8手前位に下記のような箇所が有ります。

/* トップ画像 */
.topimg{
position:relative;
overflow:hidden;
padding-top:35.63%; /* 画像の高さpx÷画像の幅px×100で導いた数値% */
background:url('https://blog-imgs-128.fc2.com/s/o/r/sorauta1/park.jpg'); /* 表示したい画像URL */
background-position:center center; /* 表示する位置 中央寄せ */
background-repeat:no-repeat;
background-size:cover;
}

paddingで高さを出し、背景の表示領域を確保します。
paddingの高さはパーセント指定で、
表示画像の高さ(縦サイズ)÷表示画像の幅(横サイズ)×100
という計算式で求めます。
(青文字の部分は表示したい画像のアップロード先URLを入れて下さい。)
縦横比の計算値で%指定すると元画像が(拡大・縮小されて)全て表示されます。
この数値を計算値より少なくすると高さが縮小され縦が非表示になり、大きくすると拡大された画像の横が非表示になります。

genial-mihon2cr.jpg

上記の場合は

/* トップ画像 */
.topimg{
position:relative;
overflow:hidden;
padding-top:45.00%; /* 画像の高さpx÷画像の幅px×100で導いた数値% */
background:url('https://blog-imgs-128.fc2.com/s/o/r/sorauta1/himawari.jpg'); /* 表示したい画像URL */
background-position:center center; /* 表示する位置 中央寄せ */
background-repeat:no-repeat;
background-size:cover;
}

になっており、
ひまわりの画像サイズは700px×315pxになっているので、315÷700×100、という計算で導いた値を%として入れています。
右カラムも左カラムも同様です。
背景色(薄いストライプ部分)を変更する場合は、同じくスタイルシート編集枠上部に有る

body::before{
background:#e7f7e7 url(https://blog-imgs-128.fc2.com/s/o/r/sorauta1/ww-st1.png) repeat center; /* 色+背景画像 */
~~~~以下略~~~~
}
の部分を

body::before{
background:#dff0ff url(https://blog-imgs-128.fc2.com/s/o/r/sorauta1/ww-st1.png) repeat center; /* 色+背景画像 */
~~~~以下略~~~~
}
に変更して頂けば薄い水色になります。
(背景色変更の際、参考色としてご覧下さい。
カラーコード表(web safe color 216色)
カラーネーム表(147色)

3カラムの場合はもうひと手間!お願いします。^^;
トップに使う画像サイズによっては左のカラムに画像が重なってしまう事が有りますので、下記のように指定部分の数値変更をお願い致します。
genial_resp3c のみ、変更画像CSS部分の下に

#left-box{
margin-top:300px; /* トップ画像を変更して左メニューに被ったら数値を増やして調整 */
}
というCSSが有るので、そこの数値をトップ画像に合わせて変更して下さい。
例えば、ひまわりの画像を利用する場合、下記画像のように重なってしまいます。

genial-mihon3c1.jpg

↑そのままの300pxだと重なってしまうので↓重ならないように380pxに増やして見栄えを調整。

genial-mihon3c2.jpg

#left-box{
margin-top:380px; /* トップ画像を変更して左メニューに被ったら数値を増やして調整 */
}


他の画像をご利用の場合も同様に、プレビューで確認しながら数値を調整し、程良くなったら更新ボタンを押し確定して下さい。
季節も丁度良いので、ひまわり画像のカスタマイズ、コピペで利用頂けます。是非どうぞ♪
大きい画像の位置を指定して使う場合は、下記リンクのページをご参考に。
serene_resp のカスタマイズ(トップ画像変更)
不具合が有った時のために、複製を作って作業すると安心です。(^-^)

Theme : 共有テンプレート * Genre : ブログ * Category : カスタマイズ
* Comment : (11) * Trackback : (0) * |

Re: - 様へ * by aki
また何かご不明な点がございましたらお気軽にお声掛け下さいませ。
(^_^)

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

Re: - 様へ * by aki
お返事有難うございます。
一点、更新案内を拍手コメントにてしておりますのでご覧下さいませ。
お手数をお掛け致します。m(__)m

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

Re: - 様へ * by aki
お返事遅くなりました。m(__)m
解決できたとの事ですが、取り敢えずお伺い致しました。(^-^)
今後とも末永くお付き合い下さいます様、宜しくお願い致します。

p.s. 貴ブログの拍手コメントをご覧下さいませ。

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

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

Re: - 様へ * by aki
ブログを拝見しましたが、無事に反映されておりますよ。(^_-)-☆
暑い夏も、爽やかな気持ちで乗り越えましょう!

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

Re: - 様へ * by aki
いつもご愛顧、有難うございます。
お伺いしてお返事致しますね。(^-^)

個別記事の管理2019-08-08 (Thu)
先日(2019/07/26) の更新で、トップページが全文表示タイプ『serene_resp』『lace_al』 の2カラム及び3カラムに、カテゴリー別及び月別のアーカイブをタイトルリスト化するHTMLを追加しました。
全文表示タイプテンプレートに加筆修正しました。
トップページ要約表示タイプのテンプレートの場合、カテゴリー別や月別のアーカイブを表示した際も同じような形で表示されるので不要かもしれませんが、件数をまとめて表示したい方(管理画面での表示設定は1ページ50件まで)用に『リスト表示化』するカスタマイズを掲載致します。

list表示1
↑これを↓こんな感じに
list表示2


list表示3
↑これを↓こんな感じに
list表示4

いつも画像がボケててスミマセン。m(__)m
投稿記事が沢山有り、シンプルにタイトルだけ表示したい方、ReadMore にございますので是非ご利用下さい。

クリックで表示します。


当方で表示の検証をしてみましたが、見栄えがおかしい場合はお手数ですがメールやコメントでご連絡下さいませ。(どのような不具合かを確認するためにも、カスタマイズを適用した状態のURLをお教え頂けると有難いです。)
カスタマイズの際は、複製を作ってから作業すると安心です。m(__)m

Return

Theme : 共有テンプレート * Genre : ブログ * Category : カスタマイズ
* Comment : (0) * Trackback : (0) * |
個別記事の管理2019-08-05 (Mon)
本日、申請していたテンプレート [genial_resp3c] [genial_resp2c-r(右メニュー)] [genial_resp-l(左メニュー)] の3点が共有化致しました。
2日の夜に申請したので土日跨いで月曜日(5日)かなぁ~?最近共有化早いから…と思っていたら、されてましたね。共有化。(^-^)
前作同様、イメージとしては『ボンヤリ・優しい・ゆったり・柔らか・ホノボノ…』な感じで、ちょっと爽やか~な風味(?)も加えてみました。
英語では『明るくて優しい、愛想のよい、にこやかな、親切な、温和な、温暖な、快適な : Weblio より』という意味ですが、スペイン語での意味は『すごい!素晴らしい!』だそうで、^^;口語的には「いいね!」な感じだそうです。(そちらの意味は自画自賛みたいで嫌だなぁ~・・ホントにただのテンプレですから。)

genial3c
3カラム(1170px以上3カラム,未満2カラム,760px未満1カラム)


genial2c-r
2カラム右メニュー(760px以上2カラム,未満1カラム)


genial2c-l
2カラム左メニュー(760px以上2カラム,未満1カラム)

(画像ボケててスミマセン。^^; 是非、共有テンプレートのプレビューで 自身のブログに適用した場合を見て下さい。)
1カラムになるとメニューがドロワー表示になり、ドロワー内のメニューは、他を開くと閉じる仕様。
また2・3カラムとも、記事上に表示されていたプラグイン3は、個別記事画面を表示すると記事下に表示され読み易くなります。
トップページのエントリー内 Comment-open でコメントを10件まで表示、個別記事ページの追記記述部分も展開式になっております。

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


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

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

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

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

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


Theme : 共有テンプレート * Genre : ブログ * Category : テンプレート
* Comment : (8) * Trackback : (0) * |

Re: どなるど 様へ * by aki
無事に設定完了、良かったです。(^-^)

子供の頃は、網戸の向こうに鈴虫やら松虫やら何やら色んな鳴き声の大合唱で夜も煩い位でしたが(新潟です(^^;)、現代の夜(今は宇都宮)は静かすぎて…うるさく夜鳴きするのは猫のはなちゃん位です。
ちょっとの時間でも運動会に付き合わないとウオウオ煩いので。(*´Д`)
多頭飼いだと相手しなくて良さそう…(返信は不要です。^^)

Re: aki 様へ * by どなるど
akiさん、早々にお返事いただきありがとう御座います(^-^)

あっちゃ〜❗設定でしたか(^^;)
テンプレートだと思い込んで…失礼しました。
教えていただいた通りにしたら、すぐ解決しました♪
本当にありがとうございますm(_ _)m

p.s. 夏と冬は電気代が怖いですよね〜(T^T)
今日、ツクツクボウシが鳴いてたので秋がすぐそこまで来てるかしら。。

Re: どなるど 様へ * by aki
こちらこそ、今晩は♪
お猫様やウサギ様に快適に過ごして頂くために^^;、昼夜エアコン入れっぱなしで(人間も快適ですけど)その分請求が今から怖いです…。
まぁ、我慢して体調崩すのが一番困るので。人も動物も。

コメントの昇降順ですが、これは管理画面の環境設定→ブログの設定→コメント設定、でコメント一覧表示を新しい順にして頂けばOKです。
設定画面って、一度設定してしまうとそんなに見る事無くなりますので、どんな項目が有ったか忘れちゃうんですよね。
…この質問で、私も先程久し振りに見ました。(^^;

コメントの新着を上に * by どなるど
akiさん、今晩は。
毎日、暑い日が続いてますね〜💦

どこかに書いてあったような気がするのですが…
見つけられなかったので質問させていただきます(^^;)

今回はコメント欄のことで質問です。
akiさんのブログのように、
コメントを新しいものほど上に表示させたいのですが、
簡単にできますでしょうか。。

Re: どなるど 様へ * by aki
解決しましたか!良かったです♪
PCのディスプレイサイズ以上に悩ましいのがスマホの画面サイズ、なんですよね。^^;
「ここで見切ったら良い!」と言われる幅は有るのですが、端末も新旧有るので…結局は自分でブラウザの幅を狭めて見て限界値を決めてる感じです。
なので…実機で確認するためにも、私のiPhoneは未だにSE(縦で幅320px)なんですよね。
旦那さんには無理やりAndroid持たせてるという…。ほぼ確認用。(^-^;

相変わらず代わり映えのないレガシーデザインなテンプレートですが、色々弄って試して楽しんで使って下さいませ。
今後とも宜しくお願い致します。(^-^)

p.s. 猫あるあるは奥が深い…けど面白い!です。
また伺いますね~♪

Re: aki 様へ * by どなるど
解決しました。ありがとう御座いますm(_ _)m

なるほど❗ディスプレイサイズで並びが変わるのですね。
勉強になりました(^-^)

p.s.「このクソ暑いのに」に爆笑してしまいました(笑)
それは猫あるあるですね。。猫はエアコンがお好きじゃないみたいです。
うちの子もエアコン点けてない部屋とか開けてる窓のそばで溶けるように寝てますよ〜熱中症にならないか心配になります(^^;)

さすけは、もう少し治るのに時間がかかりそうです。。
お見舞いコメントありがとう御座います。

あと、akiさんのテンプレートはカスタマイズしやすいように、
コメントを書いて下さってるので助かります。
本当にいつも素敵なテンプレートありがとう御座いますm(_ _)m

Re: どなるど 様へ * by aki
いつもご愛顧有難うございます。m(__)m
多分、仰られている画像の表示位置は、閲覧者のスマホのディスプレイサイズ次第で上にも左にもなります。^^;
前にiPadで2カラムと1カラムの境界を調整した事がありました。あれと一緒です。

1カラムになった後、元々の画像表示%や文字サイズ(表示行数等)を鑑みて、画像の右側に有る文字を下に落とす画面のサイズを指定しています。
例えば、ct_responsiveは400pxで横並びを解除(float:none;)しているのですが、serene_respやgenial_respは420pxで横並びを解除しています。
端末サイズも色々有りますので、これ以上狭めると横並びは読み難いかな~というサイズで見切っておりますが、ご自身で見て「まだいける!」と思われるようであれば変更して下さい。
serene_resp2cの場合は、スタイルシート編集枠かなり下の方に
@media only screen and (max-width:420px) {
という部分が有りますので、ここの420px400pxに変更して頂ければ400pxまでは横並び表示になります。

…という回答ですが、質問内容の理解は正しかったでしょうか?
最近頭が回らなくって…(;´∀`)違うようなら仰って下さいね~。

p.s. このクソ暑いのに猫のはなちゃんは「窓を開けろ!」と要求し、そのまま熱風何のそので爆睡しています。猫って暑くないのかなぁ?(やっぱり元野良だから?)
こっちは室温上がって困るんだけど…(*´Д`)
さすけ君、具合どうですか?早く元気になりますように!切に切に願います。

それと、遅れ馳せながら この度も素敵にカスタマイズ頂き、有難うございます♪

スマホでの表示について * by どなるど
akiさん、こんにちは(^-^)
またまた素敵なテンプレートの作成、
お疲れさまです&ありがとう御座いますm(_ _)m

今回もワガママな質問で申し訳ないのですが…
私が現在使っているテンプレート(serene_resp2cの要約表示)
と今回のこちらのテンプレートなのですが、

スマホで見た場合は画像が上で文章が下になりますが、
『ct_responsive2c』のように画像が左に文章が右(パソコンやiPadと同じ)に表示させる事は出来ますでしょうか?

p.s.
毎日、溶けそうなくらい暑いですね〜(^。^;)
熱中症や夏バテにならないように、ご自愛ください。。