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

*提高對 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') 等等。