Title: グローバルナビの変更方法について（CSSスプライト）
Last modified: 2016年7月30日

---

# グローバルナビの変更方法について（CSSスプライト）

 *  解決済 [tokikun](https://ja.wordpress.org/support/users/tokikun/)
 * (@tokikun)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/)
 * CSSスプライトを使っているグローバルナビの変更方法（表示される文言と文言の背景
   色）について教えてください。また、画像編集が必要とのこと、その画像の保存先をどの
   ように知ることができるでしょうか。
 * WordPressの教科書を参照しながらサイトを制作しておりまして、下記リンクがデフォルト
   での完成版サンプルサイトとなります。
    [http://pacific.prime-strategy.co.jp/](http://pacific.prime-strategy.co.jp/)
 * このサイトのグローバルナビに表示される文言とデフォルトで黒色に変わる部分を茶色
   に変更することができますでしょうか。よろしくお願いいたします。

5件の返信を表示中 - 1 - 5件目 (全5件中)

 *  トピック投稿者 [tokikun](https://ja.wordpress.org/support/users/tokikun/)
 * (@tokikun)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164487)
 * スプライト画像として使用されているPNGファイルを見つけました。このPNGファイルを
   開くと、サンプルサイトに表示されている「会社概要」の文言が、背景色が白のバージョン
   と黒のバージョンの2つ、縦に並んで表示されています。
 * このPNGファイルの内容と同じように、新しいPNGファイルを自分で作成して、FTPで上書き
   をしたらよいでしょうか。
 * 新しいPNGファイルを作るにあたって、デフォルトですでに作成されているPNGファイル
   に記載のある文言のフォントサイズやグローバルナビの一つの枠の大きさ等を、どのよう
   に確認することができるでしょうか。
 * それから、初心者でもある程度見栄え良く仕上がるスプライト画像を作る方法、または、
   ツールをご存知でしたら教えていただけましたら幸いです。
 * よろしくお願いいたします。
 *  モデレーター [けい (Kei Nomura)](https://ja.wordpress.org/support/users/mypacecreator/)
 * (@mypacecreator)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164498)
 * ここはもう、WordPress関係ない話になってくるためこの場で完全にtokikunさんのサポート
   をすることは残念ながらできませんので、あくまでWeb制作者の立場から最低限のアドバイス
   ということでご了承ください。
 * > 新しいPNGファイルを作るにあたって、デフォルトですでに作成されているPNGファイル
   > に記載のある文言のフォントサイズやグローバルナビの一つの枠の大きさ等を、どの
   > ように確認することができるでしょうか。
 * 元の画像とまったく同じように作りたいということですよね？
    それでしたら、こうや
   ればいいという完璧な方法はありません。Photoshop（無料のものならGIMPとか？）など
   を使って測りながら、試行錯誤で泥臭くやる他ないと思います。 （同じフォントを持
   ってるかどうかというのも重要です。元画像はおそらくモリサワの新ゴという有料フォント）
 * >  それから、初心者でもある程度見栄え良く仕上がるスプライト画像を作る方法、または、
   > ツールをご存知でしたら教えていただけましたら幸いです。
 * たとえばこういったページでツールが紹介されています。
    [http://javascript0.e1blue.net/js/continuation/41](http://javascript0.e1blue.net/js/continuation/41)
   [http://sbs-web.jpn.com/css/373.html](http://sbs-web.jpn.com/css/373.html)
 * しかし、紹介されているツールは「**見栄え良く**仕上がる」ツールではなく、「手間
   を減らす」というところがメインなので、tokikunさんが求めている情報がどうかはわか
   りません。
 * ここ一連のtokikunさんの投稿を拝見するに、サイト制作に必要なありとあらゆる質問
   をこちらに投げかけられているようにお見受けしました。
 * 「Webサイトを作れるようになりたい（スキルアップが目的）」なのか、
    「何らかの
   理由でWebサイトを持つ必要がある（サイトを1つ立ち上げることが目的）」なのか、 
   はたまた「趣味としてWordPressやサイト制作を楽しむのが目的」 がわからないため、
   こちらとしてもどの程度までアドバイスをしてよいものかが悩ましく感じました。 たとえば
   Web制作者としてのスキルアップを目指すのであればWordPressのことは一旦忘れてWeb
   制作に必要な基礎知識を学ぶ必要があると思いますし、 たとえばご自身で事業を行って
   いらっしゃって、その事業の広報のためにサイトが必要ということであれば、わざわざ
   Web制作をゼロから学ばずとももっと効率的な方法があるのではと思いました。
 * ここはWordPressのフォーラムなのでこういった話題はふさわしくないかもしれないですが、
   せめてこのトピック内で事情などもう少しお書きいただければもっといい感じのアドバイス
   ができるかもしれません。
 *  トピック投稿者 [tokikun](https://ja.wordpress.org/support/users/tokikun/)
 * (@tokikun)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164605)
 * mypacecreatorさん、ご丁寧にどうもありがとうございます。
    スプライト画像のサイト
   を、参考にさせていただきます。
 * WordPressの教科書の内容で網羅されるサイト作成のスキルを、短期間で身につけたい（
   概ね理解できるようになりたい）というのが、目的と言えますかと思います。初心者な
   ものなので、的を得ない質問でたいへん恐縮です。
 *  モデレーター [けい (Kei Nomura)](https://ja.wordpress.org/support/users/mypacecreator/)
 * (@mypacecreator)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164609)
 * > WordPressの教科書の内容で網羅されるサイト作成のスキルを、短期間で身につけたい（
   > 概ね理解できるようになりたい）というのが、目的と言えますかと思います。
 * なるほどなるほど。
    それですと、なおのことHTML+CSSといった、WordPressを使わない
   サイトを制作できる基礎知識を身に付けると近道になるかと思います。前も書きました
   が『WordPressの教科書』は、WordPressではない普通のサイトは制作できるレベルを前提
   としています。 しかし、このフォーラムでされる質問の多くは、むしろHTML+CSSの知識
   不足が原因のものが多かったりします。 短期間で、というとなかなか大変かもしれま
   せんが、HTML+CSSの基礎知識があれば悩む時間がかなり減りますので、おすすめですよ！
   まずはWordPressと関係なく、Webページ1枚自分で作ってみるとかなり世界が広がります。
   がんばってください！
 *  トピック投稿者 [tokikun](https://ja.wordpress.org/support/users/tokikun/)
 * (@tokikun)
 * [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164611)
 * mypacecreatorさん、ありがとうございます。
 * 作業をしていると気持ちがあせってしまって、なかなか基礎に立ち返ることが難しい時
   があるのですが、やはり基礎固めですよね。今日、基礎知識をつける本を買ってくる予定
   です！

5件の返信を表示中 - 1 - 5件目 (全5件中)

 トピック「グローバルナビの変更方法について（CSSスプライト）」には新たに返信する
ことはできません。

## タグ

 * [グローバルナビ](https://ja.wordpress.org/support/topic-tag/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93/)
 * [CSSスプライト](https://ja.wordpress.org/support/topic-tag/css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4%e3%83%88/)
 * [画像](https://ja.wordpress.org/support/topic-tag/%e7%94%bb%e5%83%8f/)
 * [変更](https://ja.wordpress.org/support/topic-tag/%e5%a4%89%e6%9b%b4/)

 * フォーラム: [使い方全般](https://ja.wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5件の返信
 * 2人の参加者
 * 最後の返信者: [tokikun](https://ja.wordpress.org/support/users/tokikun/)
 * 最後の活動: [13年、 2ヶ月前](https://ja.wordpress.org/support/topic/%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93%e3%81%ae%e5%a4%89%e6%9b%b4%e6%96%b9%e6%b3%95%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6%ef%bc%88css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4/#post-164611)
 * 状態: 解決済

## トピック

### 人気のトピック

### 返信がないトピック

### サポート関連ではないトピック

### 解決済みのトピック

### 未解決のトピック

### すべてのトピック
