精选文章

Android下使用TCPDUMP抓包Wireshark分析数据 如果想分析Android下某个APP的网络数据交互,需要在Android手机上抓包,最常用的抓包工具非tcpdump莫属,用tcpdump生成Wireshark识别的pcap文件,然后将pcap文件下载到电脑上,用电脑上的Wireshark加载pcap文件,通过Wireshark分析tcpdump抓取的数据。...

继续阅读

Mac下部署Android开发环境附加NDK 作为开发者,我们深有体会,不管是进行什么开发,为了部署开发环境,我们往往需要折腾很长时间、查阅很多资料才能完成,而且这次折腾完了,下次到了另一台新电脑上又得重新来过,整个部署过程记得还好,要是不记得又得重新开始,而且遇到Android这种GFW阻隔了开发资源下载链接的环境部署,又尤其浪费时间。所以这也是我写下这篇教程的初衷跟动力源泉,希望大家参考了这篇教程以后可以轻轻松松在Mac系统下将Android环境部署好。...

继续阅读

稍顯嚴肅的台中 坦白說,留在腦海中的台中影像並不多,來台灣之前在Booking上只訂到了台中的一家青旅,第一次住青旅有些不習慣,幹什麼都放不開。 同屋的一個男生是台灣人,不過一年中四分之三的時間在上海跟北京,這麼說來跟我還是比較有共同話題的。得之我準備花15天的時間環島,覺得太倉促了,他們大學時期花一個半月的時間也不見得能將台灣島給逛完。我只能無奈地表示,兩岸允許的簽證時間有限,自己的空閒時間更有限,只能用打卡式的旅行了,我深知正真地旅行應該慢下來,融入當地的環境,感受他們的風土人情,但第一次只能這樣作罷,以後換成民進黨上台,形勢會變成怎樣還不得而知,能否再過來還是個未知數。而我一向信奉的人生格言是秉燭夜遊,活在當下,所以,理解自己吧。...

继续阅读

為之留戀的新竹 來新竹之前本沒有對她有過高的期待,慢慢對她加分要從桃園火車站出發前往新竹開始。 在桃園火車站的候車月台上,有醒目的旅遊資料發放處,這上面的擺放的全是新竹的旅遊宣傳資料,關鍵的是資料做得非常簡潔易懂,而接下來一天的新竹之行就全部是依據這份寶典的指引來完成的。...

继续阅读

從桃園開始台灣之行 初到台灣恰逢華夏銀行系統升級,特意準備的華夏銀聯卡在桃園機場沒能派上用場,只好用建行在機場5000塊,算下來是很不划算的,但是沒辦法,誰叫我出機場就得花錢呢。 從機場打車到桃園的酒店,花了將近六百塊新台幣,到酒店時五點多,天已經漸亮了,洗漱完等到七點吃過早餐就開始補覺囉,一覺醒來已是中午,帶著換下來的衣服外出找自助洗衣店,順便覓食。...

继续阅读

  • Prev
  • Next

为WordPress添加导航菜单

2

文章分类 : Wordpress

由于本博客的主题默认是没有菜单栏的,介于自己的PHPCSS相关技能有限,一直没有考虑自己制作一个。得知最近Google全站链接改版,为了让Google生成全站链接可不是什么简单的事,即便网站有了可观的流量,如果没有很直观明了的导航栏(菜单栏),Google还是很难帮我们生成全站链接的。观察了很多有Google全站链接的博客,无一例外都是有着清晰导航栏(菜单栏)的,而且菜单项的链接地址深度大都只有一层。因为这个缘故,我终于下定决心,为CppLive 编程在线也制作一个导航栏(菜单栏)。

刚开始的时候,真是一窍不通,看着网上的很多教程,就是整不出来,后来发现自己跨不过去的那到砍是CSS,把链接地址列出来容易,因为只要调用Wordpress自带的几个函数就可以了,但是让链接有规则的排列,触发一些鼠标事件还得我们自己通过编写CSS代码实现,本人的CSS水平真是不敢恭维啊,让我照葫芦画瓢可以,要我从头开始写就是犯愁了,折腾了几个小时依旧没有任何进展,没办法了,只好找葫芦。照着别人写好的菜单栏CSS代码有针对性的改,不一会儿就搞定了,不过下拉的效果尚未实现,看哪天有空再弄吧。下面将修改的过程简要记录下,留着以后深入研究。

1、因为我使用的主题没有菜单,故需要向Wordpress注册一个导航菜单,在functions.php中加入如下代码。

/* 注册菜单,命名为Primary Navigation */
register_nav_menus( array(
'primary' => __( 'Primary Navigation', 'warrior' ),
) );

/* 下面函数是为了兼容之前的wp_list_pages() */
function warrior_page_menu_args( $args ) {
$args['show_home'] = true;
return $args;
}
add_filter( 'wp_page_menu_args', 'warrior_page_menu_args' );

2、注册好以后,需要在适当的地方调用导航菜单,显然是在header.php中调用,在header.php中加入如下代码。

<div id="nav">
<?php wp_nav_menu(); ?>
</div>

3、光有以上两步,生成的导航菜单是一列单纯的链接,极不美观,所以需要在style.css中编写nav类的实现,加入如下代码。

#nav {
    width: 985px;
    height: 47px;
    position: relative;
    padding-left: 15px!important;
    left: 0px;
}
#nav li {
    line-height: 46px;
    position: relative;
    float: left;
    list-style-type: none;
    padding: 0 15px;
    white-space:nowrap;
}
#nav li.down {
    background: url(images/down.gif) right center no-repeat;
}
#nav li.downover {
    background: url(images/down_over.gif) right center no-repeat;
}
#nav a {
    color: #fff;
    font-weight: bold;
    font-size: 14px;
}
#nav li ul {
    position: absolute;
    top: 35px;
    left: 10px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background: #fff;
    padding: 0;
    clear: both;
    display: none;
    z-index: 1000;
}
#nav li ul li {
    padding: 0;
    width: 100%;
    line-height: 20px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#nav li ul li a {
    display: block;
    width: 100%;
    padding: 3px 10px;
    text-shadow: 1px 1px 1px transparent;
}
#nav li ul li a:hover {
    color: #fff;
}
#nav ul ul{
    left: 100%;
    top: -1px;  
}
#nav {
    background: url(images/nav_skyblue.png);
}
#nav a {
    text-shadow: 1px 1px 1px #006f8f;
}
#nav a:hover {
    color: #b0ecff;
}
#nav li ul {
    border: 1px solid #007496;
}


除非注明,文章均为CppLive 编程在线原创,转载请注明出处,谢谢。

本文地址:http://www.cpplive.com/html/928.html

评论 (2)

  • 毛豆说道:

    你真的加上导航菜单了呀!

  • 无觅相关文章插件,快速提升流量