WordPress主題添加字體大小切換按鈕

字號:


    經常會看到一些網頁在顯著位置有一個“大、中、小”的字號選擇切換按鈕,這是個很人性化的設計,方便不同人群的閱讀習慣。下面以默認主題Twenty Eleven為例,把該功能集成到Wordpress主題中。
    一、打開Twenty Eleven主題文章頁面模板single.php,把下面javascript代碼:
    <script type="text/javascript">
    function doZoom(size) {
    var zoom = document.all ? document.all['primary'] : document.getElementById('primary');
    zoom.style.fontSize = size + 'px';
    }
    </script>
    加到第12行:
    <div id="primary">
    上面。
    注:primary為正文內容所在的id選擇器標簽名稱,可根據(jù)不同主題進行修改,前提正文內容所在選擇器必須是<div id="primary">形式,采用<div>控制將失效。
    二、把下面代碼:
    <div><a href="javascript:doZoom(12)">小</a> <a href="javascript:doZoom(13)">中</a> <a href="javascript:doZoom(18)">大</a></div>
    加到:
    <span><?php next_post_link( '%link', __( 'Next <span>→</span>', 'twentyeleven' ) ); ?></span>
    下面,視不同主題可以放在自己認為合適的位置。
    其中:數(shù)字為不同的字號大小,可自行修改。
    三、最后根據(jù)不同的主題添加適當?shù)臉邮娇刂?,這里略過。