スマホもPCもサイトデザインを見直しました。WPtouch Proのコツ

サイトデザインを見直しました。PC表示はヘッダー部分をリニューアルしました。スマートフォン(iPhone)表示はヘッダー部分を大きく変更しました。

あわせて、ソーシャルポタンを整理整頓、設置忘れていたしたかったZenbackも導入できました。

PC表示のテーマもカスタマイズの壷がつかめてきました。スマホに使っている WPtouch Pro の使い方とカスタマイズもコツがわかってきたので、前回に比べるとサクサク作業できました。

写真はスマートフォンのトップ画面です。[箱]がデカい!デザインです。笑。

PC版

大きな変化としては、一番上に[箱]とデカデカと看板のごとく配置しました。[箱]= ”ものくろぼっくす”っと覚えてください。お願いです。検索にて[箱]が見えたら、ご注意!です。

タイトルを変更して、約1ヶ月ほど経ちました。やっとgoogle先生に、名前が伝わったようです。くわしくは”ものくろぼっくす”で検索してみてください(笑。カタカナだと駄目でした。

ヘッダー画像を梅雨バージョンに変更しました。これは季節の変わり目ごとに入れ替えていきます。今回入れ替えてわかりました。印象はブレないけど、ちょっと新鮮だったので。

ソーシャルボタンと広告配置の調整もしました。これはどうなのか結果がわかるまで時間が必要ですね。

使っているテーマはこちらで購入したものです。3999円。お買い得だった!と満足しています。

WPtouch Pro

WPtouch Proを使っています。レスポンシブを使っていないのには訳があります。結局分岐だらけになったからです。

[箱] PCとスマートフォンのデザインはどう切り替えているの?何をしているの? 晒します。#ブロネク | ものくろぼっくす

私の使い方が悪いんだと思いますが、私の小さな能力では分けて管理する方が良いから、WPtouchを使っています。PCプラウザーでスマホ画面を表示できるので、Proにしました。これが本当に便利なんです。

WPtouch Proは子テーマが使えるます。ただスタイルシートの適応順番がイマイチわかっていませんでした。いまでも、きちんとわかっていないのですが。

元のpulginフォルダの下にあるテーマ部分のスタイルシート(syle.css)と圧縮スタイルシート(syle.min.css)をリネームして無効にしないと、小テーマのスタイルシートが適応されませんでした。

小テーマのスタイルシートも圧縮スタイルシート(syle.min.css)を適応する方が良いようです。改行コードなどを取り除く作業をした方が良いのですが、まだ、頻繁に変更するため、いまのところはそのままだけど、syle.min.cssにリネームして使っています。この癖を理解するまで、なんだか右往左往しました。基本なのに。まったく情けないです。

スマートフォン

iPhone 一本の狙い撃ちです。他のデバイスは持っていない..のです。申し訳ないです。崩れている!と通報頂けると嬉しいです。

こちらも[箱]を全面に押し出すデザインに変更しました。inbox. @haruna1221さんから、デザインの意見を頂きました。すごく助かりました、嬉しかったです。

記事タイトルがわかりにくい!と、”「おまえは今までスキャンした本の冊数をおぼえているのか?(通称:おまスキャ)」”の@ushigyuさんに指摘していただいたので、先頭に表示しました。

検索やリンクからだと記事タイトルを見て来ていただいているわけですから、その視点に違和感がなくなれば嬉しいです

「せっかく[箱]って飛び道具持っているのに、なぜ?”ものくろぼっくす”なのですか?」とストレートなめっちゃためになるご意見を覚醒する @CDiP @donpyさんから頂きました。ありがとうございました。

皆さんはどう感じられましたか?

この記事を書いた人

大東 信仁

カンパチが好きです。

プロフィールはこちら

10月14日開催 参加者募集中
(画像をタップ→詳細へ)

ミッションナビゲート モニター
(画像をタップ→詳細へ)

広告