Simplicityの特徴 › フォーラム › Simplicityについての質問 › 段落が改行に変わっている
- このトピックには8件の返信、2人の参加者があり、最後に
鈴木順一により9年、 8ヶ月前に更新されました。
-
投稿者投稿
-
-
2017年1月6日 9:06 AM #49267
つとむ
ゲストいつからかわかりませんが、気づいた時には段落していたところが改行に変わっています。
うまく説明できないのですが、Simplicity導入サイトの
http://blazechariot.wp.xdomain.jp/
http://zubora.main.jp/wordpress/simplicity-structure/の二つのサイトがありますが、私は下の人と同じように段落しているはずなのに改行のように、文字と文字の隙間が無くなっている状態です。前まではそんなことなかったのですが。
前までは↓
あああああああ
あああああああ
あああああああ
とちゃんと文字と文字の隙間がありましたが、
今は↓
あああああああ
あああああああ
あああああああとなっています。
-
2017年1月6日 9:41 AM #49268
Hidekichi
ゲスト改行自体は仕様としては変わってないと思うんですが、pタグとbrタグはcss次第でどうとでもできますし、pタグを無くしてしまえば段落にならないので、そういったカスタマイズをfunctions.phpに入れる人もいます。
何もしてないのに変わるというのは改行や段落についてはアップデートしたからどうというのはwordpressの仕様からはないと思うので、それがSimplicityの仕様変更なのか自身のカスタマイズなのかはサイトを見てみないと何とも言えません。
逆にサイトを見たらだいたい解ると思いますし、おかしければ修正すればよいだけのことなので、それを調べる必要があります。デベロッパーツールで問題の段落なり改行部分を調べて、どのようなcssになっているのかと、pタグで段落が作られているかをまず調べて、おかしいと思われているのがスマホの画面であれば、カスタマイザーでbrタグを無視するような設定が入っていないかを調べてください。
対象のページがわからないので想像ではこれぐらいしか思いつきません。
-
2017年1月6日 12:20 PM #49269
わいひらキーマスターSimplicity自体では、意図的にそういった変更は加えていないつもりです。
ただ、どういった原因なのかは、実際のページからデベロッパーツールなどで調査してみないと、何とも言えません。
-
2017年1月11日 1:20 PM #49400
鈴木順一
ゲスト上の方とは違う現象かもしれませんが、私の場合、Simplicityで運用されているサイトのPC表示でのみ、段落が改行で表示されます。モバイル表示については通常に段落が入っています。
普段利用しているブラウザはGoogle Chromeです。
なにぶん初心者なのでうまく説明ができませんが、もし原因や対策などがあればご教授いただけると幸いです。 -
2017年1月11日 4:56 PM #49401
Hidekichi
ゲスト> 段落が改行で表示されます。モバイル表示については通常に段落が入っています。
段落が改行というのは見てみないとどういうことかわかりませんが、通常は段落も改行です。
僕が知っている範囲でのSimplicityのcssは、brをdisplay: noneにするか否かだけなので、通常は、<p>何かしらのテキスト 何かしらのテキスト 何かしらのテキスト</p>こうあれば、
何かしらのテキスト何かしらのテキスト何かしらのテキストこうなって、
<p>何かしらのテキスト<br> 何かしらのテキスト<br> 何かしらのテキスト</p>こうあれば、
何かしらのテキスト 何かしらのテキスト 何かしらのテキストこうなります。Simplicityのbrを非表示が聞いている場合は、
何かしらのテキスト何かしらのテキスト何かしらのテキストこうなります。
つまり、pタグは単純にdisplay: blockかつ、margin-上下: 任意のスペースということなだけなんだと思います。またこれらはブラウザのデフォルトで設定されているもので、Simplicityでは、font-sizeと、text-align、line-heightぐらいしか設定されていないかと思います。
逆を言えばそれらを設定すれば任意の段落にできるということです。
-
2017年1月11日 6:11 PM #49410
わいひらキーマスターいろいろな原因が考えられるので、できれば、実際のページのURLを貼り付けていただけると助かります。
-
2017年1月11日 6:41 PM #49412
鈴木順一
ゲスト私がSimplicityで運用しているサイトは、
http://gyousei.jsuzuki-office.com/
http://gyousei-souzoku.com/contents/です。初心者で知識もないため、カスタマイザーでの変更以外は特にカスタマイズは行っていません。
ほぼデフォルトで親テーマのみで使用しております。
また、他の方のSimplicityで作成されているサイトも、同じように見えています。
以前は段落がきちんと入っていたと思うのですが、いつからか段落が改行に変わってしまいました。
私の方の使用環境に原因があったのであれば、大変お騒がせして申し訳ございません。
何卒、よろしくお願いいたします。 -
2017年1月11日 9:29 PM #49414
Hidekichi
ゲストサイトを見てみましたが、Simplicityのデフォルトと同じなので表示的には特に問題はないんですけれども、気になったこととして、Simplicityの過去バージョンも見てみましたが2.0あたりにも.entry-content p(#the-content p)について何かしらの記述はなく、また.article pについても特にスタイルされていません。そこでブラウザのデフォルトのスタイルが適用されていると思われます。
p { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; }chromeではこういうのがブラウザのデフォルトなんですが、-webkit-margin-before(after)は対応しているブラウザでしか動作しませんが、意味合い的には段落の前後に1em、つまりはデフォルトのことなので16pxのマージンが入ると言う点です。
段落の前後に1emのマージンができていますが、Simplicityの公式でもこのマージンは重なっています。
本来であれば、
(16pxのマージン) 何かしらの段落とテキスト (16pxのマージン) (16pxのマージン) 何かしらの段落とテキスト (16pxのマージン)こうなって欲しいところですが、おそらくはdisplay: blockのせいか何かしらで、
(16pxのマージン) 何かしらの段落とテキスト (16pxのマージン) ここが重なってる? 何かしらの段落とテキスト (16pxのマージン)このようになります。例えば、
.entry-content p { margin-top: 0; margin-bottom: 24px; } .entry-content p:last-child { margin-bottom: 0; }このようにした場合、段落の上はマージン0、下には24pxのスペースを作ることができます。.entry-contentは編集画面で入力した記事の部分(本文)なので、それ以外は指定しない限り今までと同様です。
つまり該当箇所に明示的にマージンを入れるというのがわかりやすい解決方法なのではないかと。
下方向にだけスペースを作り、最後のpはmargin-bottomを0にすることでスタイルもうまく行けるかと思います。別に上下にマージンを入れても良いですが、そうした場合、pの前にある要素の下マージンとpの上マージンとが加算されてデザインはしにくくなったりします。できるだけ記事内の他要素も含め下方向のみにスペースを取るようにするとデザイもしやすくなるかと思います。
-
2017年1月13日 10:19 AM #49444
鈴木順一
ゲストHidekichi様
初心者の私にも分かりやすいご説明、ありがとうございました。
chromeの場合、デフォルトでは段落間にスペースが入らないのですね。
Simplicityはとても気に入っているテーマなので、今後も色々と参考にさせていただき、自力でカスタマイズできるよう勉強していきたいと思います。
-
-
投稿者投稿
- トピック「段落が改行に変わっている」には新しい返信をつけることはできません。