すたすた式
Vaster1.9 Vaster2
以前のガジェットは記事に画像がない場合、画像を表示しない(空白のまま?)という仕様のようでした。
できれば画像がない場合でも画像(NO-Imageなど)を表示したいと思っていたので、新しいガジェットに変更しました。
このサイトの 2. Recent Post Widget with Thumbnailのコードをもとにしました
5+ Recent Posts Widget for Blogger: Latest and Stylish Widgets - Bloggers Origin
Get some stylish recent posts widget for blogger. All of these widgets are customized and tested for adding into blogger blog within few clicks.
設置方法はレイアウト==>saidbar-sectionにHTML/Javascriptのガジェットを追加して、上記のコードをコピペ。 表示したい数をvar numfeed = “5”の数字の部分で設定
http://blogornate.blogspot.com/の部分を自分のブログのアドレスに変更(.comでも.jpでも動きました)
これで表示自体はされますが、少しレイアウトが崩れたのでコードを少し変更しました。
.recentposareaのなかのheightの数値を79から88に、新規にoverflow:hidden;を追加しました
.recentposarea{display:block;background:#fff;height:88px;border:1px solid #ddd;margin:5px 0;padding:10px; overflow: hidden;}
height(高さ)の数値は、なんとなく収まりがいいような数値にしました。
また、.recentposarea p にdisplay:none;を追加で記述すれば、スニペット(要約)が表示されなくなります。
.recentposarea p{text-align:left;font-size:12px;margin:5px 0;color:#555;line-height:normal; display:none;}
設置自体はほぼコピペでOKでした。
参考サイトには、このようなwidgetのほかにもさまざまあり、アイデアが刺激されます。
サイト内検索に使ってください 🐤
© 2015 すたすた式
Enjoy!👍
QooQ
コメントなし:
コメントを投稿