class="post-template-default single single-post postid-480 single-format-standard" >

Virtualist Dreamer

Virtualistの後ろに影は無い 僕は幻影にすぎない

Thanks

備忘録:Stinger5でお世話になった記事一覧(主にスマホ関連)

投稿日:2月 13, 2015 更新日:

Stinger5でお世話になった記事一覧(主にスマホ関連)photo credit: Viktor Hanáček via picjumbo

こんにちわ。47才無職です。
スマホの表示を重点的にカスタマイズし、見やすくしてみました。その他にもユーザビリティの向上を目指して、いくつかカスタマイズを追加しましたので、備忘録を兼ねてアップしておきたいと思います。参考にさせていただいた皆様、この場を借りてお礼申し上げます。

(追記)Sidr関連記事を追記しました。

スポンサーリンク

スマホ関連カスタマイズ

スマホのメニューを左に寄せ、アコーディオンに

nekonotesouさんの記事を参考にして、メニューを左側に寄せて、アコーディオンも左からスッと出て来るように変更しました。こちらの記事は画像がリンク切れしていたので、少々不安でしたが、ばっちりでした!ありがとうございました!

(追記)残念ながら、記事がなくなってしまいました。

<参考>STINGER5のスマホ表示のメニューをカスタマイズ

スマホのフッター固定

ちゅんこさんの記事を参考にして、フッターに固定式フッターメニューを追加しました。デザイン・色も私のページに違和感がなかったので、コードをそのまま使わせていただきました。ありがとうございました!

<参考>【STINGER5】スクロールしてもフッターで固定するメニューを設置してみたよ!

スマホメニューを横から出す

ちゅんこさんの記事を参考にして実装したんですが、androidだと、どうも動作が不安定で実装を止めようかどうか悩んでいたところ、wordpressやアプリ開発などなど備忘録さんの記事で使えそうな対処策の記載があり、試したところ、うまく動くようになりました。お二人ともありがとうございました!

<参考>JQuery『Sidr』をWordPressのカスタムメニューに対応させ設置する方法

<参考>PageSlideがうまく動かない場合

他のカスタマイズ

関連記事を横並びに変更

ブログのちからさんの記事を参考にして、関連記事を横並びに変更しました。サイドバーとの見栄えを統一するために、コードを一部書き換えさせていただきました。ありがとうございました!

<参考>【Stinger5カスタマイズ】関連記事を横並びに変えてみた。

記事一覧のリンク範囲を拡大

キャリコさんの記事を参考にして、記事一覧のリンク範囲を拡大してみました。ユーザビリティの向上を目指してやってみました。ただ残念だったのが、サイドバーにも適用しようとしたところ、レイアウトが崩れてしまい、紹介されているコードでは対処できませんでした。このあたりは勉強して、再チャレンジしてみたいと思います。ありがとうございました!

<参考>STINGER5 の記事一覧に対してリンクのクリック範囲を広げる方法

googleカスタマイズ検索を設置

webkaru.netさんの記事を参考にして、サイト内検索を設置してみました。設置するほど記事はないんですけど、今後の事も考えて設置することにしました。ありがとうございました!

<参考>HTMLフォームを使用したGoogleカスタム検索のデザイン変更方法

今後ためしてみたいカスタマイズ

以下、チラ裏になりますが、ざっと書いてみます。
今現在、やりたいなと思っているカスタマイズです。

  • サイドバーの各カードのリンク範囲を拡大させる
  • スマホのメニュー表示を大きく目立たせる
  • スマホのサイドバー搭載
  • サイドバーの広告をランダムに切り替える
  • サイドバーの表示の優先度を下げる(記事優先に)

最後に

Stinger5関連の記事はググるとたくさんあって、自分のやりたい事もたくさん表示されますが、自分の環境でそのまま使えるかと言うと、なかなか難しいところがあります。ググるのも大切ですが、WordpressやCSSについては、自分なりに勉強していく必要がありそうです。

以上、お世話になった記事一覧でした!

(追記)下で紹介している本を購入しました!

 

 265 total views,  3 views today

<

<

-Thanks
-, , ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

アニスパ!終了。僕の人生のカンフル剤が無くなってしまったのアイキャッチ

アニスパ!終了。僕の人生のカンフル剤が無くなってしまった

  photo credit: DARC Funkertag 2004 via photopin (license) こんにちわ。47才無職です。 毎週楽しみに聞いていた、文化放送の「アニス…

続きを読む

 283 total views,  4 views today

[WordPress]導入の価値あり!G Analysticsは分かりやすい!のアイキャッチ

[WordPress]導入の価値あり!G Analysticsは分かりやすい!

photo credit: WordPress 10th anniversary via photopin (license) こんにちわ。47才無職です。 今日は、WordPressの管理画面上でG…

続きを読む

 284 total views,  1 views today

発達障害の感謝。Google先生から初の報酬が振り込まれましたのアイキャッチ

発達障害の感謝。Google先生から初の報酬が振り込まれました

photo credit: 10 via photopin (license) こんにちは。47才無職です。 ブログを書きはじめてからかなり経ちますが、先日Google先生から初の報酬をいただきました…

続きを読む

 270 total views,  1 views today

【Stinger5】Sidr安定稼働解決編のアイキャッチ

【Stinger5】Sidr安定稼働解決編

photo credit: YotaPhone 2 via photopin (license) こんにちわ。47才無職です。 ブログの更新もそっちのけで、スマホ向け画面のカスタマイズにいそしんでおり…

続きを読む

 281 total views,  1 views today

今日はブログ記念日にしようのアイキャッチ

今日はブログ記念日にしよう

こんにちは。47才無職です。 本日、Google先生から一通の郵便が届きました。ブログを書きはじめてから、もうすぐ四か月になりますが、こんなにも早くこの日を迎えるとは思っていませんでした。これも訪問し…

続きを読む

 281 total views,  4 views today