vanillaice (Akira)

vanillaice (Akira)

MacBook-Desk-Mockup_glass_shore.jpg


名称 Glass_shore
カラム数 1 と 2
プラグイン対応 ○(サイドバー集約型)
レスポンシブ対応
サイドバー 右/ ブラウザ縮小時・スマホ 下
記事幅 可変 最大800px(内寸780px)
サイドバー幅 280px(内寸220px)
任意個人設定 レスポンシブ利用 = スマホ版非表示設定
SNSシェアボタン利用 = メタタグ設定
Browser SupportIn principle, current and previous version

Chrome

Firefox

Safari

Opera

Edge

IE11

License
Required 必須事項
・Designer Note and Backlink 製作者表記と当ブログへのリンク (Designed by)
Permitted 許可事項
・Modification 改変
・Personal Use 個人利用
・Commercial Use 商用利用
Forbidden 禁止事項
・Distribution 再配布
・Hold Liable 使用にあたっての損害・損失に対する責の一切を負いません
推奨カスタム 背景変更 「最新の画像」削除 背景変更に伴うフォント変更


valid-html5.png



更新履歴 2017.1.25


・ SNSシェアリンクのUTF-8エンコード

参考記事
SNSシェアリンクのエンコード


--------- 以下本文



更新履歴 2016.11.6


不具合修正, メンテナンス

Windows10 Microsoftブラウザのスクロールバグを再hack
・ 全体レイアウト調整
・ ベンダープレフィックスの整理
・ その他微調整

Microsoftブラウザ(Edge, IE11)でスクロールの際背景画像がガクガクするバグについて
以前のhackコードが無効化されていましたので 改めて修正コードを入れました
ご迷惑おかけ致しました

本修正に伴い記事内容を大幅に変更しましたことをご了承ください
お手元のソース内容と記事内容とが合致しない場合は再DLをご検討ください


更新履歴 2016.1.10


フッター構造を変更しました
タイトルタグを微調整しました(SEO対策)


更新履歴 2015.12.12


Windows10 Microsoft社製ブラウザでスクロール時に背景がブレるバグをhack
(IE, Edge 固有バグ)


更新履歴 2015.9.22


iOS9 リリースに伴い スマホ・タブレットではColorbox起動させないよう修正しました
(Colorbox適用版は記事の最後に掲載しています)


更新履歴 2015.9.9


・ 公式化に伴うOGP削除

テンプレ付随のSNSボタンをご利用の方は ブログ個人環境のメタタグ設定をお願いします


更新履歴 2015.9.2


・ ページtop/ bottomボタン変更
・ サイト内検索追加(モーダルウィンドウ)
・ FC2検索バーがタブレットでレイアウトを壊す問題に対処

リリース済テンプレ随時更新のお知らせ

ご迷惑おかけします よろしくお願いします


更新履歴 2015.6.3


iOS Safari でブラウザバックを使うと画面がホワイトアウトして戻ってこない不具合
修正版をリリースしました ご不便・ご迷惑をおかけしました

Glass_shore修正版配信のお知らせ


----------- 以下本文



2015.3.18 第5作を申請致しました
いつの間にやら公開されておりました
ありがとうございますemo


TOP PAGE DEMO
ARTICLE DEMO
DOWNLOAD
FAQ




仕様
・ 記事やサイドバーの背景はすりガラス風に仕上げました
スマホ閲覧時にはすりガラスにはなりません
・ ページ遷移時はサイドメニューの開閉状態を保持します
・ ページ最上部にあります文言「Welcome to my blog. I've been expecting you.」
意味としては「私のブログへようこそ 貴方をお待ちしておりました」です
お好きな言葉に書き換える あるいは削除も可
(I've been waiting for you. は「遅れてきた人」に対するニュアンスがあります 念のため)


お受けできないご質問・ご相談(申し訳ございません 自己責任・自己努力でお願いします)
・サイドバーの形状変更(展開の有無の細かな指定 など)
・トップページの表示タイプ変更(要約表示から全文表示へ変更 など)
・レスポンシブを固定幅化
・カラム数やサイドバー位置変更
位置変更はこちらを参考にどうぞ ↓
テンプレートのカラム位置変更


カスタマイズをブラウザ上で行う方は
Ctrl+F(Windows)/ Command+F(Mac) キー検索をご利用ください
また
注)
で検索されますとカスタマイズのガイダンスが出てきますので事前にご確認をお願いします



背景画像変更

背景画像を変更されます方は

//blog-imgs-71.fc2.com/v/a/n/vanillaice000/glassbea.jpg

上記が該当アドレスで CSSソース内に 4箇所 ありますので
全て差し替えたい画像のアドレスに差し替えてください
画像のぼかしは自動でかかりますので ガイダンスに留意しながら作業をお願いします



管理人コメントと訪問者コメントを分ける方


デフォルトはグレー背景アイコン
サンプル




CSSソース末尾に以下を追加

.name管理人ハンドルネーム:before {
  background-color: カラーコード;
}

管理人ハンドルネーム の部分は普段コメント欄でお使いのお名前に差し替えてください
カラーコードは rgb(●,●,●) の10進数表記 #●●●●●● の16進数表記のどちらでも構いません
サンプルのカラーコードは rgb(148,170,201)

プロフィール画像などを設定する場合は以下の通り

.name管理人ハンドルネーム:before {
  content: "";
  background: url(画像アドレス) center center /cover no-repeat;
}


サンプル



* この方法をお使い頂けないハンドルネームの方 *
・文字列中に「-」(ハイフン)「_」(アンダースコア) 以外の記号(全角・半角スペース含む)
注意) ハンドルネームを判別しています 同じハンネの方がご訪問されると… ごめんなさい (割りきってお使いくださいね)





ご質問 不備・不具合のご報告はお気軽にどうぞ
その際には
・ ご自身のブログアドレスの明記
・ 該当テンプレートを設定状態に
・ 右クリック禁止の解除
上記3点を必ずお守りください
お守り頂けない場合にはお答え致しませんので 自己解決でお願いします


みなさんいつもありがとうございます ( ゚Д゚)ノ
関連記事

Comments 28

There are no comments yet.
NICO  
タイトルの色変更について。

はじめまして。
vanillaice様のこちらのテンプレートをお借りしているものです。

お聞きしたいのですが、HP名の色を白から他の色に変更をしたいのですが…。そちらはどのようにすればよいでしょうか。

色々見てみたのですが、うまく行かなかったため、教えていただけないでしょうか?
宜しくお願いします。

2015/03/26 (Thu) 14:46 | EDIT | REPLY |   
vanillaice (Akira)  
@NICOさんへ

こんにちはe-454

Glass_shoreのHP名(ブログタイトル)の色変更ですね。
変更するファイルは管理画面の下の段にあります

『Glass_shore のスタイルシート編集』

の方です。
そのソース内にそのものズバリの

.title_color {
color: rgb(255,255,255); /* ブログタイトル文字色 */
}

という箇所がありまして、その中の

rgb(255,255,255)

これが色コードです。
現在は『白』
私は10進数というのを用いて書いておりますが、16進数でもオッケーです。
その場合は
『白』
rgb(255,255,255)
#ffffff

『黒』
rgb(0,0,0)
#000000

同じ意味です。
あれでしたら、色コード作成ツールを別記事に載せておりますのでそちらをお使いください。
ちょっと待ってね。
URL引っ張ってきます(笑)

2015/03/26 (Thu) 15:18 | EDIT | REPLY |   
vanillaice (Akira)  
@NICOさんへ

http://vanillaice000.blog.fc2.com/blog-entry-35.html

こちらの記事の一番下に色コード抽出ツールがあります。
ソース内の文字列の探し方は、キーボードの

Ctrl+F

キーを押しますと 文字列を検索するフォームが出てきますので。
先ほどの内容をコピペしてお探しください。
書き換えの際は他の文字列、特に記号を巻き込まないようにご注意くださいね。

2015/03/26 (Thu) 15:22 | EDIT | REPLY |   
Kaz  
教えてください。

はじめまして。

素敵なテンプレートなので使わせていただきたいと思いました。

画像の変更はできたのですが、スマホからPC表示に切り替えると
スマホ表示に戻れなくなってしまいます。
(スマートフォン版で表示)←のボタンをスマホで見たときに表示させるには
どのようにすればよろしいでしょうか?

できればスマホ版↔PC版と切り替えられるようにしたいのです。

よろしくお願いいたします。

2015/04/07 (Tue) 11:24 | EDIT | REPLY |   
Akira  
@Kazさんへ

ありがとうございますe-454
「スマホ版で見る」の表示を出すには、
CSSソース(管理画面『下』のボックス内文字列です)の上の方と下の方に(二箇所です)に

#change_mobile{
display: none;
}


という記述がありますので、そちらを削除すると出てきます。
管理画面内で操作される場合にはキーボードの
Ctrl+F で検索窓が出ますので、上の文字列をそのまま入れて頂くとすぐわかると思います。
お手数おかけします。
よろしくお願い致しますe-257

2015/04/07 (Tue) 13:21 | EDIT | REPLY |   
Kaz  
ありがとうございます

ありがとうございました!
ちゃんと表示されました!

2015/04/07 (Tue) 20:11 | EDIT | REPLY |   
Akira  
To Kaz

ご報告ありがとうございます。
お手数おかけしましたe-454

2015/04/08 (Wed) 17:02 | EDIT | REPLY |   
MMM  
カスタマイズによる質問です

この度は大変素敵なテンプレートをご提供くださって誠にありがとうございます!
現在、自分なりにカスタマイズしようと奮闘しているのですが、2点ほど質問が
ございます。

①プラグインカテゴリ内の画像が薄くなってしまうので、プロフィール画像の
ようにハッキリ表示させたいです。

②一番下にある「RecentPics」をタイトルの下(記事一覧の上など)に移動させる
ことは可能でしょうか。

以上となります。
お忙しい中大変恐縮ですが、アドバイスいただけますと幸いです。
宜しくお願いいたします。

2015/06/13 (Sat) 11:51 | EDIT | REPLY |   
Akira  
To MMMさん

ご相談内容拝見しました。
ちょっと出る用事がありますのでしばらくお待ちくださいね。
ごめんねー!

2015/06/13 (Sat) 14:50 | EDIT | REPLY |   
Akira  
To MMMさん

その前に。

>プラグインカテゴリ内の画像が薄くなる~

の件ですが、サイドバー内に画像があり、その画像にリンクが付いている
ということでしょうか。
リンク無し画像の色が薄くなることはありませんので、そういうことかしら?

サイドバー内のリンクは一度押すと色が薄くなって二度押しができないようにしてあります(同ページリンク防止のため)
ちょっとその画像がどういう扱いになっているのかが不明ですので、

・リンク付き画像なのかどうか
・対象画像がリンク付きならば該当aタグにidまたはclassの指定があるかどうか
(あるのならば教えてください)

この二点の確認をお願い致します (*_ _)
また後程!

2015/06/13 (Sat) 14:58 | EDIT | REPLY |   
Akira  
To MMMさん

プラグイン内画像の件はご回答を待つとして。

>Recent picsをタイトル下へ移動したい件

手順数2です。
以下の文字列をCtrl+F検索(htmlソース内)

<!--not_permanent_area--><!-- 注)写真 不要な方はここから削除(この行含む) -->
<!--not_titlelist_area-->
<!--not_edit_area-->
<article class="images">
<p class="recent_pic">Recent Pics</p>
<div class="image_wrap">

<!--topentry-->
<!--body_img-->

<a href="<%topentry_link>#warped" class="non_style">
<figure>
<%topentry_image>
<figcaption>
<h3><%topentry_title></h3>
<p><%topentry_description></p>
</figcaption>
</figure>
</a>

<!--/body_img-->
<!--/topentry-->

</div>
</article>
<!--/not_edit_area-->
<!--/not_titlelist_area-->
<!--/not_permanent_area--><!-- 注)ここまで削除(この行含む) -->


上記を「カット(切り取り)」して以下の場所へ移動。

<div id='warped'>
<span class='w0'>S</span><span class='w1'>e</span><span class='w2'>e</span><span class='w3'> </span><span class='w4'>m</span><span class='w5'>o</span><span class='w6'>r</span><span class='w7'>e</span><span class='w8'> </span><span class='w9'>d</span><span class='w10'>e</span><span class='w11'>t</span><span class='w12'>a</span><span class='w13'>i</span><span class='w14'>l</span><span class='w15'>s</span>
<a href="<%url>archives.html"><div class="w16">Title List</div></a>
</div>


ここにペースト

<div id="container" class="cf">

-------------

続いて以下の文字列を検索(CSSソース内)

.images {
position: relative;
border-bottom: 1px solid;
border-bottom-color: rgb(204,204,204);
border-bottom-color: rgba(255,255,255,.1);
background-color: rgba(255,255,255,.1);
width: 100%;
height: 400px;
margin: 0 auto;
overflow: hidden;
padding: 50px 0 80px;
}

赤字の部分に一部追加して以下の通り。

.images {
position: relative;
border-bottom: 1px solid;
border-bottom-color: rgb(204,204,204);
border-bottom-color: rgba(255,255,255,.1);
background-color: rgba(255,255,255,.1);
width: 100%;
height: 400px;
margin: 0 auto 一番上の要約記事との間に設けたい空白px;
overflow: hidden;
padding: 50px 0 80px;
}


この空白を入れないと記事と密接してしまいます。
ちなみに記事と記事の間の空白は 70px ですので、それに倣うならば

margin: 0 auto 70px;

という指定をします。
この移動ですりガラスの表示・レスポンシブ時のレイアウト崩れ等の問題は発生しないかと思います。
一度お試しくださいませe-257

2015/06/13 (Sat) 16:12 | EDIT | REPLY |   
Akira  
To MMMさん

「リンクのidやclassを教えてください」
の意味と意図を書いておきますね。
意味がわかれば何をすれば良いかわかると思いますので。
私がてんで間違った予測をしていればアレですが(笑)

idやclass名が<a>にあれば、クリック後の挙動を解除することができます。
例えば

<a href="移動先" id="○○"><img src="対象画像"></a>

とあれば、その○○というidを認識してクリック後透過を避けることができます。
idもclassも無い!という場合には付けて頂く形になりますです (´・ω・`)

2015/06/13 (Sat) 16:42 | EDIT | REPLY |   
MMM  
ありがとうございます!

お世話になっております。早速のお返事ありがとうございます!

●プラグインカテゴリ内の画像が薄くなる~
の件は、リンク設定ではなかったのに薄くなるという現象でしたが、
Akiraさまのアドバイスですぐ解決いたしました!

というのも私のブログ内にリンク付画像と、リンク無画像もあり、両方とも
<a href="移動先" id="○○"><img src="対象画像"></a>
をコピペしており、リンク無画像が
<a href="" id="○○"><img src="対象画像"></a>
↑この状態で使っていたため、<a href=""を消したところ、
薄くなる現象は解決いたしました!

当方のミスでしたm(__)m


●Recent picsをタイトル下へ移動したい件
こちらも、ご丁寧なご回答ありがとうございます!
大変助かりました…!

また何かありましたらご相談させていただきたいと思います。
今後のご活躍も楽しみにしております!


2015/06/21 (Sun) 12:45 | EDIT | REPLY |   
Akira  
To MMMさん

解決して安心しましたe-454
ありがとうございます。
お疲れ様でしたe-257

2015/06/21 (Sun) 17:11 | EDIT | REPLY |   
Akira  
To あやさん宛です

ソース内容は以下の通り。

--- ご本人の確認が終わりましたので消去しました ---

2016/01/10 (Sun) 01:24 | EDIT | REPLY |   
あや  
To Akiraさん

ありがとうございます!無事に反映されました
本日は長時間にわたり助けて頂いてありがとうございました
また分からない事が有りましたら質問させて下さい
Akiraさまに感謝の気持ちで一杯です
それでは失礼します お付き合いありがとうざいました

2016/01/10 (Sun) 01:41 | EDIT | REPLY |   
Akira  
To あやさん

ご丁寧にありがとうございます。
何かありましたらお気軽にどうぞ

2016/01/10 (Sun) 01:50 | EDIT | REPLY |   
あや  

Akiraさま 返事遅くなりすみません。
FC2の方にも書かせて頂きましたが
もうご覧にならないかもと思いこちらにも転機させて頂きますね

はい、Akiraさまのおっしゃるとおりですね。
記事は徐々に直していこうと思います
そして今回このようにお手伝い頂きとても感謝しております
本当にありがとうございました
ブログでもAkiraさまのブログを紹介させて頂きました
http://aya8801.blog.fc2.com/blog-entry-785.html#warped

2016/01/10 (Sun) 17:48 | EDIT | REPLY |   
Akira  
To あやさん

あららー。
お気持ちとっても嬉しいです
こちらこそご丁寧にありがとうございますー!

2016/01/10 (Sun) 22:54 | EDIT | REPLY |   
あや  
メニュータブについて

Akiraさま
先日はありがとうございました!
この画像とても気にいっています♪
今日はカスタマイズで困っているので質問させて下さい(色々やってみましたが、お手上げです。受け付けていないようでしたらはっきりとおっしゃってください💦)


メニュータブをつけてみたのですが質問させて下さい

①PC上で、メニューバーと丸いtitle listとの距離を縮めたい

②スマホにしたときに(iPhone)レイアウトが崩れてしまいます。何か方法はないでしょうか?あるいは難しいようならスマホではPC画面にならないように切り替えしないようにできないでしょうか?

③記事に関して
read moreではなく、1記事を展開した形にすることは可能でしょうか?


※ HTMLとCSSを貼ります
Akiraさまが確認頂いたら削除でお願いします

お忙しい所恐れ入ります💦

HTML
https://www.dropbox.com/s/itl7b4w8fds6mq5/glass%20HTML.txt?dl=0

CSS
https://www.dropbox.com/s/d4sbv061tnbjd09/Glass%E3%80%80%EF%BD%83%EF%BD%93%EF%BD%93.txt?dl=0

2016/01/14 (Thu) 13:55 | EDIT | REPLY |   
Akira  
To あやさん

こんばんは (●'ω')ノ

細切れになるかもしれません。ご容赦ください。
(まだ仕事中でスタッフルームからお送りしています(笑))

① タイトルリストとの距離
CSSソース内

#dropmenu が該当です。
こちらはあやさんが追加した内容です。

margin: 30px auto 300px;

赤字部分が円形ボタンとの距離ですので、小さい数字に変更してください。
0にするのならば

margin: 30px auto 0;

0にした場合には私のソース内容で80pxの距離を取るように設定してあります。

--------

②レスポンシブが崩れる

これはドロップダウンメニューの横幅指定が原因です。
こちら後述します。

--------

③一記事を展開、というのはどういう意味だろう (´・ω・`)
「一番上の記事だけを展開させる」 --- 出来ません
あるいは
「全文表示に変更する(一記事まるまる見せる)」
ということかしら。
後者の場合は基本的にお断りしています(笑)
帰宅してソース確認しないことにはなんとも (´・ω・`)
簡単にできるようでしたら考えます ←

--------

一旦投稿しますね。

2016/01/14 (Thu) 23:55 | EDIT | REPLY |   
Akira  
To あやさん

えーと。色々指摘箇所はあるのですが。

(i) アクセス解析のソースコードが間違っている気がします。

通常のアクセス解析は「画像」で行いますが、テキストに変更してしまったのではなかろうか。
FT2になってます(FC2でなく(笑))
アクセス解析の画像には意味がありますのでユーザーがテキストに変換すると機能が失われます。
元サイトkaiseki.comがunder construction(整備中)ですので私の方からは確認できませんでした。
一度ご自分でソースコードが正しいかどうかご確認お願いします。

(ii) パン屑リスト

パン屑リストはこの位置ではまずいです。
画面上部にあるものは<body>の直下に入れたくなりますが、実際には<body>下には全体構造をまとめるラッパーあるいはコンテナと呼ばれる包括要素が存在しています。
それよりも「前」に入れてしまうと全体レイアウトが押し下げられて狂ってしまいます。
パン屑の位置は

<header id="banner">

の直下でお願いします。

(iii) ドロップダウンメニュー

これはもうレスポンシブには圧倒的に不向きです (´・ω・`)
ドロップダウンをレスポンシブで使うときにはかなり高度な技術を要します。
スマホやタブレットは「マウスオーバー」というのができません。
全て「タップ」で行います。
お使いのドロップダウンの仕様を拝見しますと、スマホで一応タップができるようにはなっていますので、折りたたまれたメニューを引っ張ることはできるようになってます(動作的には、という意味)。
ですがタイトルがページ遷移を行う<a>タグになっていますので、実際にはタップした時点でメニューが下へ降りるのと同時にページが移動してしまいます。

ドロップダウンはよくよく考えて作成しないとスマホユーザーさんにとって非常にストレスになります。
現在のこの仕様ですとモバイルでの動作は「不可」と言って良いと思います。

このドロップダウンがレイアウトを崩しています。
横幅が800px固定ですよね。
流動幅レイアウトで固定幅が存在すれば当然レイアウトは崩壊します。
これはpxを%に変更することで回避できますが、現状のものは仕様としてはできません。
かなり大掛かりな変更を加える、というか全変更って感じになるかと(笑)

このドロップダウンが存在しなければ辿りつけないページがある、というのならば仕方ありませんが、
そうでないのならばスマホでは非表示にされると良いと思います。
ぶっちゃけスマホにドロップダウンは有っても害にしかならない... (´・ω・`)

固定幅レイアウトに、ということですが、こちらも基本的にはお断りしております (*_ _)
(ソースの半分ほどの変更が必要です)

--------

ドロップダウンをスマホで非表示にする = レスポンシブを優先 = お手伝いできます
ドロップダウンを温存したい = 固定幅可 = 自己努力でお願いします
全文表示の件は少しお待ち下さい。

2016/01/15 (Fri) 00:17 | EDIT | REPLY |   
あや  

Akiraさま

遅い時間にありがとうございます

解析とパン屑直しました、ありがとうございす
なかなか難しいですね💦

タブはつけたいので
スマホの時はPC表示させないように出来ないでしょうか?
モバイル版だけにする使用で

タブを見れるのはPCの方だけなら大丈夫かな

2016/01/15 (Fri) 00:36 | EDIT | REPLY |   
あや  

ドロップダウンをスマホで非表示にする = レスポンシブを優先 = お手伝いできます

↑モバイル版にしなくてもPC版でも可能なら
そちらのやり方も教えて頂けると嬉しいです

すみませんが宜しくお願いします💦
もう遅いのでまたAKIRAさまのお時間が空いたときで宜しくお願いします

2016/01/15 (Fri) 00:40 | EDIT | REPLY |   
Akira  
To あやさん

厳密な意味でスマホからPC版へのアクセスを防ぐ、ということでしょうか。
Javascriptで可能でありますが、たぶんGoogleから警告受けます(笑)
アフィリエイトをしておられるのならば絶対手は出さない方が良いですね。

単純に「スマホから見たら『なるべく』スマホ版へ誘導」ということならば、ブログ設定でスマホ版非表示を解除するだけです。
ただしユーザーがURL末尾に
?pc
と意図的に入力した場合、Google Chromeブラウザ(スマホ版)、FC2の一部サービス及び機能を使った後での訪問 etc.
などでは強制的にパソコン版表示になります。

そこはもうあやさんの割り切りだけです。
スマホユーザーはスマホ版で!
と割り切るならば、

・スマホ版が「非表示」になっていないかをブログ設定で確認
・できれば「スマートフォン版で表示」のグレーの帯も出しておく
(CSSソース内から

#change_mobile{
display: none;
}

を削除してください。
モバイル誘導ボタンは入れてありますが、こちらの方が目立つので誘導には役立ちます)

・スマホ版から「PC版で表示」を消しておく
(これは好ましくないと思います。私なら嫌です(笑))

このぐらいでしょうか (´・ω・`)
一応スマホでドロップダウンを非表示にしておくならば、簡単なのはCSSソース末尾に以下を追加

@media screen and (max-width: 854px) {
#dropmenu {
display: none;
}
}

簡単ではありますが、ブラウザ縮小で横幅854を割り込んだ場合でも表示されなくなります。

#dropmenuの

width: 800px;


width: 100%;
max-width: 800px;

に変更しておくと良いですね。

2016/01/15 (Fri) 01:21 | EDIT | REPLY |   
Akira  
To あやさん

全文表示の件ですが、やはりヘッダー・フッターを含めた変更が必要ですので作業工程は多いです。
そしてスクリプトが多く積まれていますので、全文にされるとページの表示はかなり遅くなります。
今回はこのままでお願いします。
トップを全文にされた場合、「追記の編集」をご利用でない方は単体ページへのアクセスも減りますよ。
だってトップで全部読めてしまうわけですから(笑)
アクセス解析を入れてらっしゃるぐらいですから、ページアクセスも気にされている、と判断して書いています(笑)

2016/01/15 (Fri) 01:25 | EDIT | REPLY |   
あや  

Akiraさま
おはようございます(^-^)

一応スマホでドロップダウンを非表示にしておくならば、簡単なのはCSSソース末尾に以下を追加

@media screen and (max-width: 854px) {
#dropmenu {
display: none;
}
}

これで解消しました♪
ありがとうございます


全文表示は読者さまからの要望でした
はい、このままで大丈夫です


今回のAkiraさまのご回答で
全て解決となりました


親切にありがとうございます
感謝しております

これからのご活躍、楽しみにしています
また遊びに来ますね♪

2016/01/15 (Fri) 09:50 | EDIT | REPLY |   
Akira  
To あやさん

OKでしたか。
安心しました

お疲れ様でした

2016/01/16 (Sat) 02:08 | EDIT | REPLY |   

Leave a reply

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です
ご質問の前に必ずお読みください ↓
FC2テンプレート ご利用時のお願い