ここが困った。WordPressでレスポンシブWEBデザインテーマを使う

公開日: : その他 , ,


Responsive Web Design / adactio


実はこのサイトはレスポンシブWEBデザイン(Responsive Web Design)テンプレートを使っています。

レスポンシブって話だけ聞くと非常に便利で良さげ。
PCだろうが、スマホだろうがブラウズしている画面に合せてうまい事表示してくれます。
試しにブラウザの幅をギューンと狭くしてみたりすると、サイドメニューが下に移動したり画像の大きさが変わったりとよくできてますね。

という訳でサイトリニューアル時に使い始めました。

自分で作ろうなどという無茶な事はしません。WordPress用テーマを探しました。
国産では見つけきれなかったので海外製の無料版にしました。
ちなみにElmastudioのYokoというテーマです。

テーマを充てて過去の記事を面白がってダラダラと見ていると、テーブルが枠から超ハミ出しているではないですか!
レスポンシブはtableに対応していないのか?
HTMLでtableにwidthを追加して幅を指定してみたが、全く変わらず。。。更にスタイルを追加記入したが変わらず。。。
えぇっ、なんで?


Tables Outside Dublin Restaurant / infomatique


まぁ、大方の予想通りstyle.cssに原因があったのですが、tableの設定がとんでもないことになっていました。
左右のpaddingが20pxも!これって一般的なの?!
table使うときに常に列の数が2つ3つならいいですが、そんな事はあまりない。(私の場合です)
paddingはCSSファイルで指定しない方が得策じゃないかと判断してpadding削除。必要な時にHTMLで指定する事にしました。

一応これでデスクトップではハミ出しはなくなりましたが、スマホの縦向きで列の多いテーブルはさすがにハミ出します。横向きでは大丈夫です。

これまで国産のテーマをずっと使ってたのでよく分からないのですが、海外のテーマってこんな感じなんですかね。
tableの他にもCSSの内容でなんで?と思わせる箇所がいくつかありました。好みの話になってしまうので書きませんが。


あとひとつ。困ったというよりは迷った事。今も迷ってますが。

スマホ対応用としてプラグインの「WP touch」を使ってますが、レスポンシブテーマを使ってるので不要と言えば不要なんですよね。なんでも来いやっ!ってのがレスポンシブなので。

まぁ、でもやっぱり「WP touch」のほうがシンプルで見やすいかなぁ。。。使い勝手が悪いと意味ないし。
「WP touch」は画面上にモバイルテーマのON/OFFスイッチがあるのでとりあえずそのまま使っています。

ma3レスポンシブ

スポンサーリンク

関連記事

no image

プラグイン「All in One SEO Pack」のアップグレード[WP3.0.1]

プラグイン「All in One SEO Pack」を(1.6.12.1)から(1.6.13)にアッ

記事を読む

no image

WordPress3.0.1へアップグレード[WP3.0]

前回ようやくデータのバックアップをしたのでWP3.0.1にグレードアップしようと思う。 WordP

記事を読む

「Plip」は公式サイトWordPress Pluginsの日本語版っぽい

wp plugins / Sean MacEntee WordPressプラグインのクリップサ

記事を読む

[WordPress]ユーザー名とパスワードの変更

そういえばユーザー名とパスワードはインストールした時のままだった。 ユーザー名も「admin」のまま

記事を読む

[WordPress]テーマを変えてみた(wp.Vicuna)

photo credit: shizhao これまでデザインが気に入って「Jules Joffr

記事を読む

no image

[WordPress]パーマリンクの設定

WordPressのパーマリンクはデフォルトでは「http://example.com/?p=N」と

記事を読む

[WordPress]twitterfollowbadgeサービス終了?

最近WPのメンテをさぼりっぱなしなんですが、サイトの表示が異常に遅くなっていることに気付きました。

記事を読む

WordPressの定番プラグインを見つける方法

WordPress Stickers Everywhere / teamstickergiant

記事を読む

WordPress3.2.1へアップグレード[WP3.0.1]

upgrade / Sean MacEntee しばらくWordPress本体のアップグレードを

記事を読む

no image

プラグイン「WP-PageNavi」のアップグレード[WP3.0.1]

プラグイン「WP-PageNavi」を(2.72)から(2.73)にアップグレードした。 「自動

記事を読む

ma3レスポンシブ

スポンサーリンク

Comment

  1. まっくす より:

    はじめまして。
    yokoのテーマで辿ってきました。

    自分も同じテーマを使っているのですが、カテゴリが7つ以上になると

    2段目に下がって左から順にカテゴリが並ぶものと思っていたのですが

    右から並んでしまいます。

    これを左から順番に並べることはできるのでしょうか?

    ご存知でしたら是非知恵を貸していただけないでしょうか?

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

    • massan より:

      まっくすさん、はじめまして。まっさんです。
      返事遅れてすみません。GWで休んでました。

      サイト拝見しました。
      ヘッダー部に表示するとこうなるんですね。やったことないので知りませんでした。

      並びの件はCSSの設定でしょうね。style.cssのSub Navのところをどうかすればいいのではないかと。
      で、具体的には・・・私自身CSSが得意ではないのでよく分かりません!ごめんなさい!
      「float」とか「回り込み」とかで検索するとヒントが出ると思います。

      どなたかお分かりの方いらっしゃいましたらフォローお願いします。(他力本願・・・汗)

Message

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

ma3レスポンシブ

スポンサーリンク
ハンディアイロンスチーマーを上手に使うコツ

先日、テレビでジャパネットをダラダラと見ていたらスチームQというハンデ

今さらiPhone画面回転ロックの解除方法

iPhoneの画面回転ロックの解除方法です。 iPhone本体を縦や

[WordPress]twitterfollowbadgeサービス終了?

最近WPのメンテをさぼりっぱなしなんですが、サイトの表示が異常に遅くな

害虫用凍結スプレーの効果は絶大だった!

いやぁ、ついに出ちゃいました。 夏の風物詩。黒いアイツが。ゴキ○リで

2015版プロ野球PRIDE(プライド)トレード相場一覧表~随時更新中~

2015版プロ野球PRIDEトレード相場一覧表(まっさん調べ)

→もっと見る

  • にほんブログ村 自転車ブログ 自転車通勤・通学へ にほんブログ村 スマホ・携帯ブログ スマートフォンへ
    • SEOブログパーツ
PAGE TOP ↑