ラベル(文字)が付いた投稿を表示しています すべて表示

Bloggerブログのトップページのスニペットの数が減ってしまったらどうするか

イメージ

Bloggerブログはトップページに表示するスニペットの数は管理画面のメニューから決めることができる。 レイアウト ブログの投稿 メインページに表示する投稿数 設定 投稿 メインペーに掲載する投稿数の上限 ※メインページはブログのトップページ。 二ヵ所から決めることができてどちらも同じで、片方を変更するともう片方が自動的に揃うようになっている。 しかしブログのトップページに実際に表示されるスニペットの数が決めたよりも減ってしまうことがあり、正常に動作せず、不具合が生じたような結果になると分かっているから予め注意して決めなくてはならない。 トップページのスニペットの数が減る二つの原因 元の記事の画像数が非常に多い場合 元の記事の文字数が非常に多い場合 Bloggerブログのトップページに表示するスニペットが取られる元の記事の合計の画像数か文字数が一定の分量を越えるとその時点で…

JavaScriptの正規表現でURLなどの文字列の間の文字列を検出/取得する方法

イメージ

正規表現で文字列の間、一つの部分から他の部分までを指定するには両端を任意で決めて中間をパターンで記載する。 何でも良ければ「.*」(どんな文字でもなければなくてあればあるだけ続く:文字の0以上の繰り返しという指定)が一般的に使える。 例えばサイトや画像などのURLで半角スラッシュ(/)の間を指定するには「/.*/」のように記載する。 参考サイト 正規表現パターンの記述 JavaScriptで使う場合は文字列の半角スラッシュはエスケープしなくてはならないので、正規表現リテラル(/文字列/)ならば半角バックスラッシュを前に一つ追加して「 \/.*\/ 」、それを正規表現オブジェクト(RegExp()コンストラクター)に渡すならば半角バックスラッシュを前に二つ追加して「 \\/.*\\/ 」と書き換えることになる。 Istanbul by Ben_Kerckx / CC0 目…

CSSで画像に文字を重ねる:グリッドデザインでアイテムのスペースを合わせて表示する

イメージ

サイト作成で画像に文字を重ねる場合にそれぞれの位置取りが難しい。加えて レスポンシブ でデバイスの画面幅によってデザインが伸縮されると画像と文字のバランスが崩れ易い。二つの悩みを同時に解決するために最も相応しい方法は グリッドデザイン :displayのgridで、画像と文字のスペースを合わせて表示できるから正確だ。 目次 グリッドデザインで画像に文字を重ねるソースコード 画像の中央に文字を重ねる 画像の右上に文字を重ねる 画像の左上寄りに文字を重ねる 文字の位置取りを余白で調節する 区分けしたレイアウトで画像に重なる文字を整序させる 画像の中央の下のスペースの中央に文字を重ねる 文字を整序して位置取りを余白で調節する 文字の幅を確保しながら画像に重ねる グリッドデザインで画像に文字を重ねるソースコード 画像に文字を配置するスペースの割合を計算する 計算されたスペースの中に文字を…