[nob] メニューバー(グローバルナビゲーション)の変更がうまくいかないので・・・

兎組の課題で WordPressのテーマの課題をやっていた時の事。

Twenty twelve のスタイルシート style.css を編集してメニューバーの背景と文字を変更してみたのですが、文字と文字の背景だけが変わっただけ(コードを読めば当たり前なのですが、、、)で、ボタンとボタンの間に隙間ができて思ったように行かず。スタイルシートって何? の状態だったので、その時は諦めて10日ほど放置しましたが、このまま引き下がるのは悔しいので、「HTML/XHTML & スタイルシート レッスンブック」を買ってきてリベンジすることにしました。

HTML+CSS

WordPress を使うには、スタイルシートの知識は必須のようですね。JavaScript より重要そう。

[nob] メニューバー(グローバルナビゲーション)の変更がうまくいかないので・・・” への7件のコメント

  1. 確かに、JavaScript より、HTML,CSSの方が先ですね。
    でも、HTML,CSS もいっきょに習得は、範囲が膨大。
    しかも、HTML4 → HTML5 、CSS2 → CSS3 への移行期です。
    まぁ、無理せず、ぼつぼつと。

  2. テーマ編集をみんなで共有してはということを考えてみました。
    そのままとかエディタでは、膨大過ぎて手に負えません。
    ワードにコピーして行番号を入れると、色でマークできるので、助かります。

    作ったワードファイルをメディアに入れてみました。
    http://homeken.sakura.ne.jp/homeken/wp-content/uploads/2013/08/elevn-css-original.docx

    ひらいて、530行目あたりからコメント入れてます。コメントで行番号を変えない注意が必要ですが。
    個人で探し出したものを、追加して共有したいです。
    ドロップボックスが一番いいのだけど、どうかしら??

    • う~ん?
      テーマファイルの style.css の解読もいいのですが、これとマトモに、格闘すると、ノックアウトをくらう可能性が大きいです。
      子テーマ(child)テーマを作って、対処するのがお勧めかと。
      子テーマについては、おっつけ、やろうと思ってますが、ちょっと早すぎるかなと躊躇しているところです。
      兎」で、子テーマを採用してます。
      メインメニューに色をつけるのも、子テーマのstyle.css に数行。
      これが、メインのstyle.css を上書きしますので、その部分だけ適用されます。=みてください。

      • php ファイルも読まないとノックアウトされそうですが、解読してみてノックアウトをくらうのも勉強のうちと思います。
        ただ、最終的には子テーマで対処するのがベストでしょうね。兎の中でも進捗はバラバラなので子テーマの話は少し先かな~?

        • ハイ、ノックアウトくらったら、その顚末の詳細報告も、お願いしますね(笑)。

      • 水田さんにそういわれると、スタイルシートへの足が止まってしまいますが・・・。
        仕掛けは少なく、形態はシンプルでいいけど、デザインにこだわりたいんですよね。
        でものぶさんが興味を持っていらっしゃるうちに、私も色々教えて頂きたいので、しばらくelevnのスタイルシートと格闘してみます。

        • ナビの右側にマージンを取る件、これでいかがでしょう。
          むかごのwpでテストしました。
          ————————–
          #access a {
          color: #eee;
          display: block;
          margin-right: 20px;・・・・・新規に挿入
          line-height: 3.333em;
          padding: 0 1.2125em;
          text-decoration: none;
          background-color: #990000;・・・赤い色
          }

コメントを残す

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