スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

【simple_photo】任意の画像をサムネイル表示する方法

スマートフォン版テンプレート【simple_photo】の記事一覧で表示されるサムネイルを、好きな画像に変更できます。

sp1.png
↑記事一覧ページ(トップページ等)
記事中の絵文字がサムネイルになってしまっています。


sp2.png
↑記事個別ページ
絵文字より下の画像をサムネイル表示させます。


変更方法
・ブログ管理ページ→『新しく記事を書く』または『過去記事の管理』から記事の編集画面を開く
・『本文の編集』欄のサムネイルにしたい画像のimgタグに[ id="simple_photo_img"]を追加

↑の画像の例の場合、2番目に出てくるimgタグに[ id="simple_photo_img"]を追加します。

変更前
こんにちは<img src="絵文字のURL" class="emoji" style="border:none;" /> ←のように絵文字が記事の最初にある場合や複数の画像がある場合、指定した画像をサムネイルにします。

<a href="サムネイルにしたい画像のURL" target="_blank"><img src="サムネイルにしたい画像のURL" alt="" border="0" width="640" height="425" /></a>

変更後
こんにちは<img src="絵文字のURL" class="emoji" style="border:none;" /> ←のように絵文字が記事の最初にある場合や複数の画像がある場合、指定した画像をサムネイルにします。

<a href="サムネイルにしたい画像のURL" target="_blank"><img id="simple_photo_img" src="サムネイルにしたい画像のURL" alt="" border="0" width="640" height="425" /></a>


sp1.png
サムネイルが変更されました。


ご質問や不具合報告、リクエスト等お気軽にコメントください♪
スポンサーサイト

Tag : simple_photo

トラックバック


この記事にトラックバックする(FC2ブログユーザー)

まとめ【【simple_photo】任意】

スマートフォン版テンプレート【simple_photo】の記事一覧で表示されるサムネイルを、好きな画像に変更で

まとめ【【simple_photo】任意】

スマートフォン版テンプレート【simple_photo】の記事一覧で表示されるサムネイルを、好きな画像に変更で

コメントの投稿

非公開コメント

simple_photo_bg.png を任意の画像にする方法はありますか?

simple_photo のように画像をサムネイル表示するテンプレートを求めていました。
素敵なものを作ってくださってありがとうございます!

質問なのですが、
記事中に画像がない場合に、代わりの画像として表示されるsimple_photo_bg.png を任意の画像にする方法はありますか?

よかったらお返事ください。
お待ちしております。

Re: simple_photo_bg.png を任意の画像にする方法はありますか?

simple_photo 愛用者さん

コメント&【simple_photo】を愛用していただきありがとうございます♪

画像がない時のサムネイルは、『テンプレートの管理』から『simple_photoのスタイルシート編集』で、

#entry_list li .entry div {
position:absolute;
top:50%;
margin-top:-35px;
right:15px;
width:70px;
height:70px;
background-image:url(http://blog-imgs-48.fc2.com/t/s/h/tshop33/simple_photo_bg.png);
-webkit-background-size:70px auto;
background-size:70px auto;
background-repeat:no-repeat;
background-position:center center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 1.5) {
#entry_list li .entry div {
background-image:url(http://blog-imgs-48.fc2.com/t/s/h/tshop33/simple_photo_bg2x.png);
}
}

上記2箇所のurl()内を任意の画像のアドレスに書き換えてください。
※ブラウザの検索機能かメモ帳などに一度コピーして”bg”で検索すると見つかると思います。

simple_photo_bg.pngは70px×70px
simple_photo_bg2x.pngは140px×140px(iPhone4以降等のretinaディスプレイ用)
で作成しています。

記事ごとに画像を変えたい場合は、記事の編集画面の『本文の編集』で

<img id="simple_photo_img" src="サムネイルにしたい画像のURL" style="display: none;" />

上記赤字の部分を任意の画像のアドレスに書き換えて、本文中のどこでもいいので追加してください。
記事中に画像はあるけど見えなくする、という方法なので、もともと記事中に画像がある場合でも使えます。

長くなってしまいましたがわかりますでしょうか・・・?
また何かありましたらコメントください☆

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

プロフィールについて

プロフィールについてですが、プラグインのプロフィールで設定している文章や写真を表示させたいのですが、現在何も表示されません。

HTMLの知識はそこそこあります。

ご教示していただけないでしょうか?

サムネイルを左右交互では無く
左側に揃えて表示する事は、可能ですか?

トップページのタイトルと画像の位置の変更方法

こんばんわ。
とても素敵なテンプレなので使わせて頂いています。
カスタマイズしようと試みたのですが、うまく出来なかったので質問させてください。

トップページのタイトルと画像の位置を変更したいのですがうまくいきません。
記事ごとに左右に画像とタイトルが分かれますが、
画像を右(または左)へ固定することは可能でしょうか?

お忙しいとは思いますが、お教えいただけたら幸いです。

サムネイル表示を左合わせにする方法を教えてください。

画像をサムネイル表示できてシンプルなテンプレートを探していました。
素敵なデザインでとても気に入っています。ありがとうございます。

カスタマイズについて質問させてください。
サムネールの画像表示を左合わせに統一し、以降のタイトルなども左の頭合わせにしたいのですが、どうしたらよいでしょうか。

よろしければ教えてください。
よろしくお願いします。

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

テンプレート使わせていただいています。

質問なんですが
PCでは『追記を読む』と表示される記事を、スマホでも同じように表示する事はできますか?
できれば、折り畳み式で表示したいのですが…

検索して、試してみたのですが
『追記を読む』をタップして、追記事が表示されたのですが、タップしたら『追記を読む』の文字が『追記を閉じる』に変わっていて
PCのように、追記事の後に『追記を閉じる』が表示するようにしたいのです。

お時間がある時で構いませんので宜しくお願いします。

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

初めまして、素敵なテンプレートをありがとうございます。
さっそく私ブログに導入させていただきました(*´∀`*)

質問なのですが、当方iPhoneを使っており、記事本文に載せた写真については画面の中に収まって表示されるのですが、追記に載せた写真については同じサイズでも画面からはみ出して、一部しか画面内に表示されません。
追記内でも写真が画面の中に収まるように表示させる方法はありますでしょうか?
また、追記内の写真を記事一覧のサムネイルに表示させる方法も、合わせて教えていただけると幸いです。
拙い日本語で申し訳ありません…。

お忙しいとは存じますが、ご回答いただければと思います。

使わせていただいてます。

ところで、個別エントリーで
タイトルなどから本文までの間を、少し狭くするにはどうしたらよいのでしょうか?

本文の上に線などもありませんし、少し間(行間)が空きすぎているように思えるのです。

お忙しいとは思いますが、お返事宜しくお願いいたします。

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

何回もアクセスしたら
カテゴリー表示が正常になったりしてきました。

たまに、違う時があるのですが…

しばらく様子をみてみます。
お騒がせしました。

Re: タイトルなし

12.2.22の非公開コメントHさん

テンプレートでは画像の向きの指定はしていませんので、おそらく画像ファイルの問題ではないかと思います。
お役に立てず申し訳ありませんm(__)m

Re: プロフィールについて

Negin.さん

スマートフォンとPCでプラグインが別のものになっています。
同じ表示にするには、PC用のプラグインのHTMLをスマートフォン用のプラグインのHTMLにコピーしてください。

Re: タイトルなし

政信さん

表示位置に関してはご要望が多いため別記事で説明させていただきます。
よろしくお願いいたします。

Re: トップページのタイトルと画像の位置の変更方法

lyさん

表示位置に関してはご要望が多いため別記事で説明させていただきます。
よろしくお願いいたします。

Re: サムネイル表示を左合わせにする方法を教えてください。

simple_photo Fanさん

表示位置に関してはご要望が多いため別記事で説明させていただきます。
よろしくお願いいたします。

Re: 不具合

12.10.07の非公開コメントDさん

ご報告ありがとうございました。
現在確認できないのですが、まだ不具合が続いていましたら詳細を教えていただけると幸いです。
改善し問題なくお使いいただけていることを願っています(^^)

Re: タイトルなし

みみさん

ご希望の表示にするにはカスタマイズが必要ですので、別記事で説明させていただきます。
よろしくお願いいたします。

Re: サムネイルの件です

13.1.31の非公開コメントUさん

ご使用に特別な作業や設定は必要ありません。
こちらでは問題ないのですが、まだ不具合が続いていましたら詳細を教えていただけると幸いです。
改善し問題なくお使いいただけていることを願っています(^^)

Re: タイトルなし

13.4.22の非公開コメントNさん

解決されたようでよかったです(^^)
ご利用ありがとうございました。

Re: トップページの時間表示について

13.7.15の非公開コメントSさん

時間表示は『テンプレートの管理』『simple_photoのHTML編集』の
<%topentry_hour>:<%topentry_minute>
という箇所になりますので、上記を削除してください。
トップページのみですと157行目辺り、先頭から探して一番最初に出てくる部分です。
メモ帳等の検索機能を使うと探しやすいと思います。

Re: タイトルなし

しろくろさん

追記の画像サイズ等ご指摘ありがとうございます!
指定が漏れていましたm(__)m
後日修正して申請しますが、可能でしたら手動で修正をお願いいたします。

『テンプレートの管理』『simple_photoのスタイルシート編集』で、
403行目辺り
.entry_body img {
max-width:100%;
height:auto;
}
となっているところを

.entry_body img ,
.entory_more img {
max-width:100%;
height:auto;
}
に編集していただくとご希望どおりになると思います。
お手数おかけしますがよろしくお願いします。

追記の画像は自動でサムネイルに設定されませんので、現在の記事を参考に指定してください。
記事の新規作成または編集画面で、サムネイルにしたい画像のタグに[ id="simple_photo_img"]と追加します。
<img src~>となっている部分です。
見当たらない場合はエディタの『ソース』というボタンを押してみてください。
わかりにくいと思いますがご希望通りにお使いいただけるようになれば幸いです。

Re: タイトルなし

ぶーちゃんさん


個別エントリーのタイトル・本文の余白の変更は、
『テンプレートの管理』『simple_photoのスタイルシート編集』で
一番最後に下記を追加し、数値を変更してください。

.entry_title {
padding-bottom:15px !important;
}
.entry_body {
padding-top:15px !important;
}

15pxずつが現在の設定なので、数値を小さくすると間隔が狭くなります。
2箇所とも同じ数値にする必要はありません。

Re: カテゴリーについて

みみこぉさん

表示数に関してはFC2が用意している変数で表示していますので、もしおかしい場合はFC2の不具合の可能性が高いと思います。
正常になったようでよかったです(^^)

承認待ちコメント

このコメントは管理者の承認待ちです
プロフィール

sasha

Author:sasha

テンプレート確認環境

*PC版

Windows
OS:Windows7
ブラウザ:IE・Firefox・Safari・Opera・GoogleChrome 最新バージョン

Mac
OS:MacOSX 10.7.2 Lion
ブラウザ:Safari・Firefox・GoogleChrome

*スマートフォン版

iPhone4S
OS:iOS5.0.1
ブラウザ:Safari

最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
タグ

simple_photo (5)
natural_linen (1)
simple_white (1)
retro_pop (1)

検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。