0

こんにちは—Wordpressブログ(www.doublecrossxx.com)のナビゲーションの右上にあるこれらのソーシャルメディアアイコンをクリック可能にしようとしています(そして惨めに失敗しています)。コードを追加して適切に配置することができましたが、画像の周囲にクリック可能な領域を作成する方法がわかりません。

#access {

background: black;
background-image: url("http://doublecrossxx.com/images/sm_dcxx.jpg");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 599pt 2pt;
height: 27px;
width: 23px;
display: inline-block;

    float: left;

    margin: 0;

    width: 845px;
}
4

2 に答える 2

0

<a>人々がクリックするための実際のリンク('s)はありません。#accessdivに背景画像を適用しただけです。

したがって、何らかの方法で#accessdivにリンクを追加する必要があります。テーマファイルが表示されませんが、推測する必要がある場合は、 header.phpというファイルを調べてください。これは通常、ワードプレスページの上部を構築するために使用されるものです。

#access divをすぐに見つけることができ、次のようなリンクを追加できます。

<div id="access">
   <!-- some php stuff for your menu -->
   <a id="fb_link" href="(link to facebook)"></a>
   <a id="twitter_link" href="(link to twitter)"></a>
</div>

次に、CSS(おそらくstyle.css)で、#accessの代わりにその画像をこれら2つのリンクの背景として使用します。

#fb_link, #twitter_link {
    background: url("images/sm_dcxx.jpg") no-repeat top left;
    width: 25px;
    height: 25px;
 }
#twitter_link {
    background-position: top -25px;
 }

(25pxの量を調整する必要があります、それは私の側の単なる推測でした)

この手法の欠点は、リンクを変更する必要がある場合に、header.phpを手動で変更する必要があることです。大したことではありませんが、注意する必要があります。

また、画像のURLは次のようになっていることに気付きました。

http://doublecrossxx.com/images/sm_dcxx.jpg

これは、WordPressインストールのトップレベルに/images/というフォルダーを作成したことを示しています。あなたはそれをすべきではありません。WPインストールに追加するすべてのファイルは、少なくとも/wp-content/に配置する必要があります。プレゼンテーションの一部である画像(ここで問題になっている画像など)は、必ずテーマフォルダーにある必要があります。上記のCSSでは、CSSファイルの隣にある画像フォルダーへの相対リンクを使用しました。

于 2012-05-02T18:03:01.160 に答える
0

リンクをクリックできるようにするjsフィドルを作成しました。問題が発生した場合はお知らせください。

http://jsfiddle.net/trickeedickee/PYTnm/

于 2012-05-02T18:10:35.497 に答える