【自作テンプレート】よくある質問まとめ
当サイトで配布中のBloggerテンプレートに関するカスタマイズや補足情報についてのQ&Aをまとめました。
テンプレートに関するQ&A
Q.記事に目次やアドセンスが表示されない
記事内の目次やアドセンスを入れたい部分に「<!--more-->」を挿入して下さい。
<!--more-->はモアタグと言うもので、通常であれば「続きを読む」を付けるのに設けられます。
Bloggerではよく使われるので「<!--more-->」を「もあ」などで単語登録しておくと便利です。
Q.<!--more-->を挿入しているのに目次やアドセンスが表示されない
現在のBloggerの仕様では「<!--more-->」挿入時に「<span><!--more--></span>」となります。
これをただの「<!--more-->」にすることで正常に表示されるようになります。
Q.ヘッダ部分に挿入した画像がズレる
この問題の解決方法は、上記の記事にてまとめてあります。
Q.トップページの記事リストの設定を変えたい
この問題の解決方法は、上記の記事にてまとめてあります。
Q.アーカイブページで番号付きページャのリングがバグってしまう
この件については仕様なので解決不可能です。
この問題については上記の記事で解説しています。
Q.標準の画像ビューアが動作しない
この問題の解決方法は、上記の記事にてまとめてあります。
なお、最新版では修正してあります。
Q.個別記事ページャに記事タイトルを表示させたい
この問題の解決方法は、上記の記事にてまとめてあります。
Q.個別記事ページャの最新・最古記事のリンクがおかしい
この問題の解決方法は、上記の記事にてまとめてあります。
Q.最新記事をトップページで表示させたくない
この問題の解決方法は、上記の記事にてまとめてあります。
Q.投稿部分の下に挿入したガジェットの背景が透明になる
この問題の解決方法は、上記の記事にてまとめてあります。
Q.ガジェットのCSSが上手く設定できない
この問題の解決方法は、上記の記事にてまとめてあります。
Q.CSSをイジってもスマホやタブレットの表示が変わらない
当サイトのテンプレートではレスポンシブデザインを使っています。
レスポンシブデザインとは表示するデバイスのサイズによって表示を変更する設定のことです。
これは各項目に「/* レスポンシブデザイン(スマホ用) */」といったくくりを設けています。
この中の「@media (max-width: 768px) {~}」内を変更してみて下さい。
Q.ガジェットの見出しが目次に含まれてしまう(注目の投稿追加で目次に異常が出る)
この問題の解決方法は、上記の記事にてまとめてあります。
Q.Twitterカードが上手く表示されない
この問題の解決方法は、上記の記事にてまとめてあります。
なお、最新版では修正してあります。
Q.コメントに画像を表示させたい
この問題の解決方法は、上記の記事にてまとめてあります。
なお、最新版では修正してあります。
Q.サイトマップを作りたい
BloggerのXMLサイトマップは「ブログURL/sitemap.xml」とすることで自動生成されます。
Q.スマホ用のファビコンを設定したい
この問題の解決方法は、上記の記事にてまとめてあります。
Q.font-awesomeが□で表示されてしまう
この問題の解決方法は、上記の記事にてまとめてあります。
Q.自動目次の無いバージョンでも目次を表示させたい
この問題の解決方法は、上記の記事にてまとめてあります。
Q.注目の投稿ガジェットの画像が小さい(ぼやける)
この問題の解決方法は、上記の記事にてまとめてあります。
その他のお役立ち情報
CSSを学ぶ方法
上記の記事で具体的にまとめています。
テンプレートを上手に編集する方法
BloggerテンプレートをカスタマイズするにはGoogleChromeのデベロッパーツールを使うと効果的です。
これについては上記の記事で具体的にまとめています。
Bloggerテンプレートの制作過程
当サイトで公開中の「Hello, world!」の制作過程をまとめています。
部位ごとに詳細をまとめていますので、こちらを参照することで分かることがあるかもしれません。
スポンサーリンク
スポンサーリンク
コメント
21 件のコメント :
はじめまして!
HelloWorld、とてもわかりやすいテンプレートで、重宝して使わせて頂いてます。
自己解決してはいますが、気づいた点があったので、報告します。
ページ全体のBodyをいじって、デフォルトフォントを変更しようとしたら効きませんでした。
ちょっと調べてみると、その下のガジェットのデフォルト設定をリセットしている部分があると、bundle_v2.css に上書きでもされてしまうようです。
bodyタグ部分を、ガジェットのデフォルト設定をリセット、の下に移動したら効くようになりました。
たのじぃ さんへ
問題のご指摘ありがとうございます。
CSSは同じタグがある場合には、より下に書かれたタグが優先されるのでそうなったのでしょう
また個人的に調べておきます
素敵なテンプレート、ありがとうございます。
ダウンロードいただきましたが、色変更ができず、また、目次が記事のしたに出てしまい、テンプレートを変えましたが、再び、こちらのサイトの目次ありをダウンロードしたところ、ホーム場面がおかしくなりました。ブロガーのテーマに変えてもホームボタンを押すとおかしくなったホームに戻っちゃいます。どうしたらいいのか教えていただけると助かります。
京都思い出図鑑さんへ
管理画面のレイアウトからウィジェットの配置を修正すると直るのではないでしょうか?
もしダメならバックアップした古いテンプレートを当てて一旦元に戻したほうが良いと思います。
大変お世話になっております。お陰様で問題は解決できました!ありがとうございます。今後ともよろしくお願いいたします。
「最新記事」で表示投稿記事にYouTubeを貼り付けると、「最新記事」で表示されるサムネがYouTubeのサムネになってしまいます。
出来れば1番上に貼り付けた画像を、「最新記事」のサムネイルで統一したいのですが。されるサムネが
すいません、上のコメントは打ち間違いです。
正しくは以下の通り
===========================================
投稿記事にYouTubeを貼り付けると、「最新記事」で表示されるサムネがYouTubeのサムネになってしまいます。
出来れば投稿記事の1番上に貼り付けた画像を、「最新記事」のサムネイルで統一したいのですが。
かんたさんへ
最新記事の画像は記事の一番上にくる画像のURLを取得する仕様になっています
ですので、サムネにしたい画像を一番上に持ってくると上手くいくのではないですか?
ふでたまごさんへ
ご回答、ありがとうございます。
いろいろ試した結果、YouTubeのsrc="https://www.youtube.com/embed/○○のタグを、src="https://www.youtube-nocookie.com/embed/○○に変えたら、上手くいきました。
何度もすいません。
メインページに表示される記事一覧の左側のサムネイル画像を、正方形にしたいのですが。
使用しているテンプレートは「hello,world」です。
かんたさんへ
.article-thumbnail img {
width: 99%;
height: 99%;
border: solid 1px #ddd;
object-fit: cover;
}
まず、HTMLの編集からソースを見て上の部分を探し出します。
上の部分の「height」と「width」を同じ値にすれば正方形にできます。
例えば、値を「200px」に設定すれば200×200pxの正方形になります。
何度も何度もすいません。
そのとき使用する300×300の元画像を、200×200のサムネイルで表示しようとした場合、その元画像が200×200と縮小されて表示されるのではなく、元画像のうちの200×200の部分しか表示されません。
300×300の元画像を200×200のサムネイルで表示させる場合、元画像のサイズも200×200に変更させるべきなのでしょうか?
出来れば元画像のサイズを変えずに、指定した大きさに縮小してサムネイル表示させたいのですが。
かんたさんへ
.article-thumbnail img {
width: 99%;
height: 99%;
border: solid 1px #ddd;
object-fit: cover;
}
上記の「object-fit: cover;」を「object-fit: fill;」に変えてみてください
返事が遅れて申し訳ありません。
なんとかうまくいきました。
本当に何度もすいません。
サイドバーに表示される「最新コメント一覧」について質問です。
この「最新コメント一覧」には、コメント投稿者の名前と投稿された日時は表示されるのですが、どの記事にコメントされたかという記事のタイトルが表示されません。
サイドバーの「最新コメント一覧」に、投稿された記事のタイトルを表示させるには、どうしたらよいのでしょうか?
はじめまして、smart頑張ってイジりながら使わせて頂いています。
ヘッダーナビのところにアコーディオンメニューを実装したくて頑張っていますが、さっぱりうまくいかず手詰まりになっています。
やり方をご教授いただければありがたいです。
よろしくおねがいします。
新たにテンプレートをインポートしたら、コメント一覧がサイドバーではなく、「不正行為を報告」の真下に用事されるようになってしまいました。
どうしたらいいでしょう。
なおレイアウトの「フッター」には、何もガジェットを追加していません。
誤字訂正。
不正行為を報告」の真下に用事されるようになってしまいました。…×
不正行為を報告」の真下に表示されるようになってしまいました。…○
このサイトで使っているコメントのタイムスタンプの形式や、Hello, world! サンプルページで使っているアーカイブインデックスの日付形式に変更するにはどうすれば良いのでしょうか。Bloggerの設定やレイアウトからは変更できず、このサイト内は一通り調べたのですが見当たらなかったので、質問させて頂きました。
コメントを投稿