*修復頂部社交媒體圖標缺失的問題

*提高對 woocommerce 的兼容性

*進一步提高移動視圖

*修復設置頁面動畫

*其他小的修復

2.0 更新日誌

*新建和改進 Mantra 設置頁面

*為了更好地進行分組,對部分設置進行了移動

*新的頂部設置選項:頂部高度,網站頂部選擇器 (網站標題/logo/鏈接等),自定義 logo 上傳器,頂部上方空間和菜單圓角設置。

*修復頂部自適應問題。

*插件化字體功能

*提升對 jQuery 插件的兼容性

*提升移動視圖

*修復社交郵件鏈接

*修復欄目代碼

*修復 「帶有介紹的分類頁面模板」 的 html 佈局問題

*修復一系列未定義的小 bug 。

一、瀏覽器支持:

支持所有主流瀏覽器,報括了 Mozilla Firefox, Opera, Chrome, Safari,以及 IE 。但在 IE 上的顯示會有所不同。 (貌似對 IE6 的支持不太好,譯者注) 。

二、移動設備端支持。

在部分的移動設備的瀏覽器進行過測試,顯示效果相當不錯。

三、 wordpress 版本支持

支持 3.3 以上的版本。

四、在主題設置中,我不能更改主題的佈局?

或許你在使用 IE 。使用其他瀏覽器,效果會更好 (該主題在後台對 IE 的支持不太好,經測試 IE6,7,8 都有以上問題。 9 以後沒機會測試。)

五、我怎樣才能使用 Mantra 以外的字體?

你不得不自己編輯文件了。

六、如何移除段落縮進

到 Mantra 設置> 文本設置。

七、文章標題和頂部之間有較大間隔,該如何移除

到 Mantra 設置> 文本設置。

八、該如何隱藏頁面標題?

Mantra 設置> 圖像設置> 頁面標題

九、能夠添加 Mantra 沒有的社交媒體 icon 嗎?

不能。如果你真的想增加,你只能覆蓋原有的 icon 。不過要注意 icon 的尺寸 (42 x 42 px)

十、如何將圖片設為網站的頂部,並隱藏網站標題和描述

A 、通過外觀> 頂部,將圖片設為網站的頂部。再到 mantra 設置> 圖像設置> 標題和描述。如果你在使用透明 (或者部分透明) 的頂部圖片,也可以通過以下方法來實現:mantra 設置> 顏色設置,將 「頂部 (banner 和菜單) 背景顏色」 的輸入框留空。

十一、如果我想在演示頁面顯示多於 5 張幻燈片?

你能夠自定義 5 張幻燈片。你也能夠對幻燈片做如下設置:將最新 x 篇文章,x 篇隨機文章,最新 x 篇置頂文章,最新 x 篇指定分類文類,隨機 x 篇指定分類文章,特定文章 (通過 ID) 。 X 是一個可以配置的數。為了是幻燈片能夠兼容文榮,要求為文章添加標題 (將作為幻燈片的標題) 和文章中的特色圖片 (將顯示為幻燈片圖片) 。確保特色圖片的尺寸合適 (與幻燈片一致) 。

十二、同時使用演示頁面和博客頁面

新建頁面,並選擇 「博客模板」 作為頁面的模板。然後在菜單上添加該頁面的鏈接。 (如果沒有自動生成的話)

十三、設置菜單字體和顏色

控制面板中,只能設置菜單的背景顏色。我們會逐漸增加設置菜單字體和顏色的選項。但在此之前,你可以通過自定義 CSS(在雜項設置下的自定義 CSS 選項框中輸入),實現自定義菜單

-菜單的背景顏色

#access ul li { background-color: #aabbcc; }

-菜單顏色和字體

#access ul li a { color: #aabbcc; font-family: Helvetica }

- 激活菜單的背景顏色

#access ul li.current_page_item, #access ul li.current-menu-item { background-color: #aabbcc; }

- 激活菜單顏色和字體

#access ul li.current_page_item a, #access ul li.current-menu-item a { color: #aabbcc; font-family: Helvetica; }

- 懸停時菜單背景顏色

#access ul li:hover { background-color: #aabbcc; }

- 懸停時菜單顏色和字體:

#access ul li a:hover { color: #aabbcc; font-family: Helvetica; }

-子菜單背景顏色

#access ul ul li { background-color: #aabbcc; }

- 子菜單文本顏色和字體

#access ul ul a, #access ul ul ul a { color: #aabbcc; font-family: Arial; }

 - 懸停時子菜單背景顏色

#access ul ul li:hover, #access ul ul ul li:hover { background-color: #aabbcc; }

-懸停時子菜單文本顏色和字體

#access ul ul li a:hover, #access ul ul li:hover a { color: #aabbcc; font-family: Arial; }

十四、改如何添加自己的 CSS 。

我們不建議修改 Mantra 的 CSS 樣式表。這樣你會在下次升級的時候丟失設置。 (或者你強迫從不升級,這樣你就失去修復所有的 bug,版本完善,功能增加的機會) 。我們可以通過外觀>mantra 設置> 雜項設置> 自定義 CSS 來實現。同時,你也可以自定義自己的 javascript 。

十五、如何將菜單居中

因為設置選項中沒有涉及到相關內容,你需要利用自定義 CSS 實現該功能。

#access, #access .menu { text-align:center; }

#access ul li { float: none; display: inline-block; }

#access ul ul a { text-align: left; }

如果你想菜單向右對齊,將上述代碼的第一行換成:

#access, #access .menu { text-align:right; }

十六、如何添加社交媒體 icon

按照以下的步驟,你能夠添加一個或者多個自定義的社交媒體 icon 。假設你現在創造了一個 「Newsocial」icon(注意大小寫。在所有事項都要保持相同的大小寫) 。

0 、創造一個子主題。這樣可以保證你的設置的主題升級的時候不丟失。子主題只需要兩個文件:style.css(記錄有內容) 和空的 funtion.php 。

1 、找到你想要的新的社交媒體的 icon,創建一個 37x37 px 透明 png 圖片。並把圖片放在 child-theme/images/socials/Newsocial.png

編輯 child-theme/functions/php(原文是這樣,但是不是 child-theme/functions.php),並在裏面寫入以下代碼:

<?php

function child_override(){

global $socialNetworks;

if (is_array($socialNetworks)) { $socialNetworks = array_merge( $socialNetworks,  array('Newsocial') ); };

};

add_action( 'after_setup_theme', 'child_override' );

function mantra_set_social_icons($id) {

global $mantra_options;

foreach ($mantra_options as $key => $value) { ${"$key"} = $value ; }

echo '<div id="'.$id.'">';

for ($i=1; $i<=9; $i+=2) {

$j=$i+1;

if ( ${"mantra_social$j"} ) {

$icon = get_stylesheet_directory_uri().'/images/socials/'.${"mantra_social$i"}.'.png';

$localicon = get_stylesheet_directory().'/images/socials/'.${"mantra_social$i"}.'.png';

if (!file_exists($localicon)) { $icon = get_template_directory_uri().'/images/socials/'.${"mantra_social$i"}.'.png'; }; ?>

<a target="_blank" rel="nofollow" href="<?php%20echo%20esc_url(${"mantra_social$j"}); ?>"mantra_social$i"}); ?>" title="<?php echo esc_attr(${"mantra_social$i"}); ?>"><img alt="<?php echo esc_attr(${"mantra_social$i"}); ?>" src="<?php%20echo%20$icon%20?>" /></a><?php

}

}

echo '</div>';

}

?>

3. 現在你的新的社交媒體 icon 就會出現在設定面當中了。

PS:如果你想添加更多自定義 icon,將第四行的 array('Newsocial') 替換成 array('Newsocial','Newsocial2') 等等。