如何增加社群的圖示

與 phpBB 3.0.x 相關主題。
回覆文章
頭像
心靈捕手
默默耕耘的老師
默默耕耘的老師
文章: 8510
註冊時間: 2004-04-30 01:54
來自: Taiwan

如何增加社群的圖示

文章 心靈捕手 »

首先,我們需要建立一個新的資料夾,存放我們要使用的圖片。

進到 /styles/prosilver/theme/images 以及建立一個 /social/ 資料夾。

在那個資料夾中,放進您想要顯示在頁頂的圖示。
這些圖片應該命名為「social_name.png」。
例如,臉書的圖片可以命名為「social_facebook.png」。

在這篇文章中,我將使用下列的圖片: 接下來,前往 /styles/prosilver/theme,開啟 colours.css ,在其底部增加下列代碼:

代碼: 選擇全部

#social_bar {
   margin: 0 auto;
   position: relative;
   right: 10px;
   top: 30px;
}
#social_buttons {
   float: right;
}
前往 /styles/prosilver/template,開啟 overall_header.html

找到

代碼: 選擇全部

<div class="inner"><span class="corners-top"><span></span></span>
在下一行,新增下列代碼:

代碼: 選擇全部

            <div id="social_bar">
               <div id="social_buttons">
                  <a href="Link to your feeds"><img alt="RSS" width="33px" height="33px" src="{T_THEME_PATH}/images/social/social_rss.png"></a>
                  <a href="http://www.facebook.com/"><img style="border-radius:4px 4px 4px 4px;" alt="Facebook" width="33px" height="33px" src="{T_THEME_PATH}/images/social/social_facebook.png"></a>
                  <a href="http://www.twitter.com/"><img style="border-radius:4px 4px 4px 4px;" alt="Twitter" width="33px" height="33px" src="{T_THEME_PATH}/images/social/social_twitter.png"></a>
               </div>
            </div>
經過這些改變,以及到 ACP 重新整理您的風格後,在搜尋盒底下的社群圖示應該是可見的。

要修正這個情況,您可以按以下的方法完全刪除搜尋盒
移除搜尋盒 & 增加搜尋圖示在導航棒中
或者是遵循以下的指示。

前往 /styles/prosilver/theme,開啟 common.css

找到

代碼: 選擇全部

#search-box {
   color: #FFFFFF;
   position: relative;
   margin-top: 30px;
   margin-right: 5px;
   display: block;
   float: right;
   text-align: right;
   white-space: nowrap; /* For Opera */
}
將其中的「margin-right: 5px;」取代成「margin-right: 20px;」,
這將移動搜尋盒到社群圖示的左邊。

結果如下:
圖檔

別忘了到 ACP 重新整理您的風格。

--
資料來源:
https://www.phpbb.com/kb/article/how-to ... ial-icons/
施比受有福,祝福您好運! ^_^
歡迎光臨★★心靈捕手★★ :: 討論區
https://wang5555.dnsfor.me/phpBB3/
回覆文章

回到「3.0」