Quiet - FC2ブログテンプレート

このテンプレート審査通過していました
エンターページ無しのファイルの掲載をお待ちしていますm(_ _)m

の件でお伺いします！
リンクを増やしましたｗ
こんな感じです

<li class="wow slideInRight"><a href="<%url>?page-0.html" class="underline-reveal">HOME</a><!-- 注)ここはトップページへのリンクです -->
<li class="wow slideInRight" data-wow-delay=".1s"><a href="#" class="underline-reveal">Writing</a>
<li class="wow slideInRight" data-wow-delay=".2s"><a href="#" class="underline-reveal">Work</a>
<li class="wow slideInRight" data-wow-delay=".3s"><a href="#" class="underline-reveal">Book</a>
　　　　<li class="wow slideInRight" data-wow-delay=".4s"><a href="#" class="underline-reveal">Music</a>
<li class="wow slideInRight" data-wow-delay=".5s"><a href="<%server_url>control.php" class="underline-reveal">ADMIN</a><!-- 注)ここは管理ページへのリンクです -->

で、Bookだけがなぜか飛び出して表示されますｗ
ほかはちゃんと同じ位置に盾に並んでいるのですが。
お暇な時でかまいません、よろしくお願いします。

お知らせありがとうございます。
掲載致しました

原因は

Book</a>

の後ろ ないし
Music用の

<li class 〜省略

の前のいずれかに半角スペースの羅列があるからです。
ソース内の半角スペースは、タグの間にあるものは見た目に影響します。
タグの間　↓

<div>ここのこと</div>

タグの外であっても インライン要素や displayのinline-block
そして今回の<li>は半角が影響します。
修正は半角スペースの削除。

<li>要素やインラインブロック指定要素は難しくはありませんが、扱いが繊細かもしれない　(´・ω・｀)

ありがとうございます!(^^)!
直りましたｗ

コピペするときに、見た目を整えようとせずに
普通に左詰めにコピペすれば良かったんですねｗ

またまた今更なことを伺ってすみませんでした<(_ _)>

エディターを利用すると滅多に起こりませんが(絶対ではない)、ブラウザ画面上で作業すると意図せぬ半角ができてしまうことが。

修正できたようで良かったです。
お疲れ様でした

エディター……
そうだ、ちゃんとhtml用のエディターがあったのに……
横着をしました(ё_ё)
次回から必ず、エディターを使ってカスタマイズいたしますσ(^◇^;)

レス不要です<(_ _)>

ホームのテンプレート、次回の新作ですか？
シンプルだけど、すっごいきれい！
サムネイル画像が、左右交互に配置されているのって
今までなかったタイプじゃないですか？
さすがだなぁ……

はい。次回予定でございま　( ﾟДﾟ)ﾉ
いつもありがとうございます

いつもAkiraさんのテンプレートにお世話になってます
このテンプレート素敵ですね…
個人的にサイトっぽく見えるテンプレートが好きでその中でもこれはかなりツボです…！
メッセージを送らずにはいられなかったです。
スクロールで変化するのも遊び心がありますね〜
いつも素敵なテンプレートをありがとうございます。
返信不要です。

励みになります〜　( ﾟ∀ﾟ)

全然関係ないけど管理画面からコメントを拝見するのに、間違えて「拒否」押しちゃって超焦った　（￣∀￣；）
ちゃんと解除できてますよね？
大丈夫かしら　（￣∀￣；）

今後も精進致します。
ありがとうございます

こんばんわ、Akiraさん。
いつもお世話になります。
不器用すぎるあいすびーばーaboです。
グリム楽しいですよねー♪

失礼しました･･･つい、書きたくなってしまって。


すみません、本題です。
Ivoryからこちらへ変えてみたのですが
トップヘージや、カテゴリー別のページで表示される画像についているTwitterシェアボタンを押すと空白ページに飛んでしまいます。他のFBやTBやコメントボタンは大丈夫なのですが。

エンターページなしで使用しています。
理由わからず、すみません。



あと、記事幅は変更可能でしょうか？
最大幅がIvoryくらいが理想なのですが。


お時間ある時でかまいませんので、よろしくお願いします。

アイスビーバー ｷﾀ━━━(ﾟ∀ﾟ)━━━!!!
彼はもう、とっても愛されキャラ(笑)
しかしシーズン4が気になる　（￣∀￣；）
DVD買いたいけど娘が吹き替え版じゃなきゃヤダって言う　（￣∀￣；）

で、Twitterの件。
マジですか　（￣∀￣；）
ちょっと今から確認して追記しますね。
ご面倒おかけしますー！

-------- 追記

以下の環境で検証しました。
私の方では症状を確認することができませんでした。

Windows 10
・Google Chrome
・Firefox
・Opera
・Microsoft Edge
・IE11

Mac OS X Yosemite El capitan
・Google Chrome
・Firefox
・Vivaldi
・Opera
・Safari

で、Twitterサイドの方を調べましたらば、2016.4.9から断続的にサーバー障害が発生しているようです(現在も継続中？)。
もしかしたらそれが原因かしら？

http://downdetector.jp/shougai/twitter/mappu/

再度ご確認頂けると助かります。
事前にキャッシュの削除やクリーニングなんかされたほうが良いかもです。

----- 別件(記事幅の件)

Ivoryの記事幅が実質660pxで結構小さいんですよね。
Quietの方が920pxですので「縮小」ということでお間違いないでしょうか。
Ctrl+Fキー検索

#float-container

4つヒットしますのでそのうちの2つ目です(CSSソース内にあります)
詳細

#float-container {
margin: 0 auto;
width: 90%;
max-width: 1300px;
padding: 0 0 80px;
}

赤字部分を1100にされますと記事幅が720pxになります。
トップページレイアウトを考慮するとこのあたりがおすすめ。
目視確認しながら調整をお願いします。
それから、このままだとブログタイトルの位置が左寄りで気になるかもしれません。
逆に気にならないかもしれません(笑)
ですから以下は任意で調整をお願いします。
Ctrl+Fキー検索。

#blog-name-container

CSSソース内に一箇所あります。
詳細
#blog-name-container {
margin: 0 auto;
width: 90%;
max-width: 1300px;
padding: 70px 8px;
}

赤字部分を記事幅修正で指定した数値と同じにされるとほぼ同じ位置になります。
よろしくお願いします

こんばんわ、Akiraさん。

遅くなりすみません。

わたしもシーズン4･･･首がきりんになるくらい伸びきって待ってる人間です～。もうババンと放送して欲しいです。


で。すみません･･･
さっそくチェックしてみたのですが、本日もやはりTwitterシェアのページに飛ばないようなのです。もしかして私が何かしてしまったのかも･･･なので、もう一度インストールし直してみますね。

お手数かけて、すみませんです。


記事幅もありがとうございました。
こちらはバッチリです。


それから･･･ですが、Ivoryの引用タグの装飾が気に入っているので、こちらでも使用してよろしいでしょうか？

わー　（￣∀￣；）
この件もお伝えすべきことが(引用のこと)

ちょっと後ほどまた参ります。
そしてGrimm関係でもショックなことが！！！(笑)

---------

実はですね、Ivoryのblockquote記号が文字化けしてたんです　（￣∀￣；）
修正済みですが、aboさん気づいてくれたかなー　と思っておりました。
なんかアルファベット出てませんでしたか。
なにこれ！ちょっとかっこいいけどなに！
みたいな((((笑)

もしあれでしたら、簡単に変更できますのでやってみてください
Ctrl+F(2箇所)

blockquote:before

それから

blockquote:after

この2箇所にそれぞれ

content: "記号";

という箇所がありますので、記号の部分に表示したい文字を入れます。
アルファベットでも良いですし、記号でもOK。
日本語・漢数字もOKですが、すっごい文字大きいと思う　(´・ω・｀)

Grimmなんですけど聞いてくださいよー。
昨日何か情報ないかとFBの公式にいいねしたんです。
そしたらアメリカ人男性フレンドさんが
「グリム好きなの？まさかあんな展開になるなんてねー！」
とか言っちゃって、すんごいネタバレ書かれたんだけど(笑)
えっちょっと待って..まだ見てな...ってゆーか、えぇ？！？！
みたいな((((笑)
しかもシーズン4どころかたぶん5の内容だわ。あれ。
ひどいじゃん！！！(笑)

こんばんわ、 Akiraさん。

いろいろとご丁寧にありがとうございます。


Twitterシェアの件は記事タイトルが原因のようです。
わざわざ記事に書いてくださってありがとうございます。
そうだったのか～と･･･ホント知らないとは･･･ですね。
これは、もう･･･過去記事は手直しできないので泣くしか･･･




そして、引用の件。
これ、自分の中で大うけでした(＾◇＾)
文字化けしてたんですね～。
（意味わからないけど）これ超カッコいい～と思ってました。
もうホント自虐ネタになりそう。
でも気に入っているので文字変えて使うかもです。




そしてそして
本題？GRIMMですよー。
あれ･･･ですよね？
へくせんびーすとがらみのニックの家族的な？･･･みたいな？
シーズン3のラストの流れから、そうきてそうなって･･･ええ～！･･･みたいな？
ネタバレ見ないようにしてるんですけど、シーズン6更新のニュースに浮かれて･･･うっかり踏んでしまいました。
6月からシーズン4が始まりますが（スパドラで）これ、いっきにシーズン5まで見ないと･･･とジリジリな気持ちです。

実はグリムのシーズン3を待つ間、寂しさを紛らす為に始めたブログなんですー。
この勘違いの「引用」の件も、グリムの記事にぴったり･･･と気に入ってた次第･･･。
お恥ずかし～。

タイトルでしたかー。
もしかして...。と思ったもので　(´・ω・｀)
これは言われないとわからないですよね。
FC2のタイトルがどんな仕様になっているか、ってのもユーザーに細かく説明があるわけじゃないですし。
なんにしても原因わかって良かったです　^^;
あと、引用の件もごめんなさいね(笑)

Grimm辛いなー　（￣∀￣；）
身悶えするぐらいですよ。やぐってるよ((((笑)
展開についても、全米のみなさんは納得しているの？？
そして私に納得させられるの？
って感じ

aboさんはGrimm大好きさんだったんですね。
書いた甲斐があったってもんです(笑)
いつもありがとうございます

こんにちは、以前にこちらにコメントさせてもらった者です、
コメントちゃんと見られてますよ〜、ありがとうございます！

さっそくこの素敵テンプレートお借りしているのですが
ちょっと教えて欲しいことがあって再び参りました。

FC2メールフォームを使っていてそのタグをそのまま貼り付けているのですが、
メールフォームのレイアウトが崩れてしまうみたいです。

アカマイ広告、一ヶ月広告が出ている状態のブログだとフォームのレイアウトが崩れているので
広告が悪さをしているのかな…と思っているのですが
これは何か対策があるでしょうか？

あとアカマイ広告、一ヶ月広告が出てない状態のブログだと
フォームの崩れは大丈夫なのですが
メールフォームの入力項目タイトル名(名前、メールアドレス、内容…など)が表示されていないようです。

こちらも合わせて教えていただけたらうれしいです。

ありがとうございます　( ﾟДﾟ)ﾉ

メールフォームは公式のものでしょうか。
公式以外(つまり共有)のプラグイン内容については言及できませんので先にごめんなさい　(*_ _)
公式である、と仮定しまして
製作専用の別ブログの方で広告が出ていますのでそのスクショです　↓

アドブロックが効いているとき
http://i1236.photobucket.com/albums/ff443/oo0kim0oo/FC2%20temp/f924riqfr4q_zpsja76gbjh.jpg

アドブロックを解除したとき
http://i1236.photobucket.com/albums/ff443/oo0kim0oo/FC2%20temp/9ai4uo3q4_zpseig9x4qm.jpg

いずれもレイアウト崩れというのは確認できませんでした。
オーバーレイが原因で... というのは考えにくいので、
① メールフォームのソースに問題がある
② 特定の記事やプラグインのソースに問題がある
このいずれかではないかと思います。

参考記事
http://vanillaice000.blog.fc2.com/blog-entry-292.html

手順に沿って原因を特定して頂きまして、特定した原因の修正方法がわからなければこちらへソース内容をお伝えください。
まずは特定作業の方をお願いします　(*_ _)

Akiraさん

丁寧な検証ありがとうございます…！
※こちらURL超過でコメント書き込みエラーになったので文中のURLは全てhを省いて記述してます。


そしてお手数おかけしてすみません、
メールフォームのレイアウト崩れについては
入れていたプラグインを消したら崩れなくなったので
Akiraさんのおっしゃる通り原因は広告ではなかったようです。
お騒がせして本当に申し訳ないです。

私の使っていたメールフォームは公式プラグインのメールフォームではなく
フォームをカスタマイズできるFC2メールフォーム(ttp://form.fc2.com/)のタグを記事本文に入れる方法だったのですが
とにかくプラグインが干渉していたようです。
Akiraさんに教えてもらってFC２ブログのプラグインでメールフォームがあることを知りました！(遅い…)


ただ、FC２メールフォームの項目が表示されないことについては
プラグインや記事の干渉ではなさそうです…

検証してみたブログ→(ttp://akki0akki.blog.fc2.com/blog-entry-1.html)
書いた記事はFC2メールフォームのタグを本文に入れた１記事のみ
テンプレには手を加えていません。

同じ条件で、Akiraさんの他のテンプレートでその記事を確認してみると、
FC２メールフォームの項目も問題なく表示されるようです↓

・BetweenNeo→(ttp://akki0akki.blog.fc2.com/?no=1&style2=BetweenNeo)
・Life-is→(ttp://akki0akki.blog.fc2.com/?no=1&style2=Life-is)
・Alternative→(ttp://akki0akki.blog.fc2.com/?no=1&style2=Alternative)

ちなみに検証したテンプレはAkiraさん作の私のお気に入りテンプレ達です(*´ω｀*)


貼ったタグはデフォルトのタグをそのままコピペしたものなので
もしかしたらFC２メールフォームのタグとQuietとの相性の悪さがあるのかなあと思いつつ。
タグのソースは↓(文字化けがちょっと心配ですが…、idの数字は一応●●に変えました)

<!-- FC2RetalForm Start -->
<script type="text/javascript" src="http://form1.fc2.com/parts/index.php?id=●●"></script>
<noscript><a href="http://form1.fc2.com/form/?id=●●" target="_blank">[FC2メールフォーム]</a></noscript>
<!-- FC2RetalForm End -->



Quietにメールフォームをつけるのなら記事ではなくプラグインにしようかなあと思っているところです。
なので一応のご報告のみです…！

私の早とちりでお手数かけて本当にすみません
ご丁寧にありがとうございました。

こういうサービスがあるんですね。
私こちら存じませんでした(笑)

今ソースを拝見しましたけれども、これはJSで勝手に出力される類のものですよね。
なんか変なソースなんだけどな　（￣∀￣；）
「お問い合わせ」
という項目ありますよね。
表示されてないけれど。
ここのタグが
<li>
なんですよね。
この<li>要素というのは<ol>あるいは<ul>と一緒に使うべきものなんだけども、
ソース中にいずれも存在しません。
え。なにこれ
<div>の子要素としていきなり<li>
これシンタックスエラーなので崩れますね。ええ(笑)
謎の<li> (´・ω・｀)

でもってこのJSを削除するとバリデート100点なのですが、JSから吐き出されたコードが入るとエラーが3点。
あとダブルスラッシュのコメントアウトもこれアカンのじゃないか　(´・ω・｀)
なんでこうなったかはちょっと全体ソースを絡めないとなんとも。
ただこのJS自体あんまりよくないのは良くないです。
(<style>〜</style>をhtml内に書いてしまう点等 html5では厳禁です。)

公式メールフォームで代用できるようでしたらそちらをおすすめします。
なんかすっきりしなくて申し訳ない　（￣∀￣；）

------

いやー。これやっぱりおかしいね。
<div><li>内容</li></div>
これがたくさんある。
これはhtml的にダメですね　(´・ω・｀)
これ逆に今まで崩れなかったのは近接内容に<ul>を使っていないからだと思われます。
Quietは記事タイトル下で<ul>が2箇所あります。
<li>を使う時はこういう入れ子になってないといけませんね　↓

http://qiita.com/mikuhonda/items/d89c3df38dc6e3175fde

うーん。謎ソース(笑)
これたぶん太古の昔にIEで表示させることだけを目的に組んだ内容と思われます。
実際IE(古いやつ 7とか8とか)ではこれでフツーに表示されてしまいます。

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

上で先ほど質問したものです。自己解決できました。ありがとうございます。

解決済みということで、お疲れ様でした