搜索
Hi~登录注册
查看: 1061|回复: 0

wordpress中文章百度分享的另外一种效果 -wordpress教程

[复制链接]

1892

主题

1899

帖子

6406

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6406
发表于 2015-4-20 15:49:17 | 显示全部楼层 |阅读模式

                                <b>[文章目录]</b>
                                <ul id="index-ul">
<li>一:在single.php模板里的需要添加的位置添加如下代码</li>
<li>二:添加样式代码</li>
</ul>
                        </div>
同学们大家好,今天<span style="color: #ff0000; font-size: 14pt;"><span style="color: #ff0000;"><strong>吾爱互联</strong></span></span>将与大家分享文章内容下百度分享的另外一种效果
效果图
<img class="aligncenter size-full wp-image-1031" src="http://www.wpjiaocheng.com/wp-content/uploads/2014/09/百度分享另外一种效果.jpg" alt="wordpress中文章百度分享的另外一种效果" width="757" height="303" />
制作方法:
<h2 id="title-0">一:在single.php模板里的需要添加的位置添加如下代码
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt"><div id=<span class="string">"divleft"</span>></li>
<li><div id=<span class="string">"single_list"</span> style=<span class="string">"width:746px; float:left;background-color: #FFF; border: 1px solid #e7e7e7; margin-bottom:8px;overflow:hidden;"</span>></li>
<li class="alt"><p>好文章就要一起分享!</p></li>
<li><!-- Baidu Button BEGIN --></li>
<li class="alt"><div id=<span class="string">"bdshare"</span> <span class="keyword">class</span>=<span class="string">"bdshare_t bds_tools_32 get-codes-bdshare"</span>></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_qzone"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_tqq"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_tsina"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_renren"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_ty"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_ff"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_fbook"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_baidu"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_hi"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_zx"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_douban"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_t163"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_xg"</span>></a></li>
<li class="alt"><a <span class="keyword">class</span>=<span class="string">"bds_qq"</span>></a></li>
<li><a <span class="keyword">class</span>=<span class="string">"bds_tieba"</span>></a></li>
<li class="alt"><span <span class="keyword">class</span>=<span class="string">"bds_more"</span>>更多</span></li>
<li><a <span class="keyword">class</span>=<span class="string">"shareCount"</span>></a></li>
<li class="alt"></div></li>
<li><script type=<span class="string">"text/javascript"</span> id=<span class="string">"bdshare_js"</span> data=<span class="string">"type=tools&amp;amp;uid=730973"</span> ></script></li>
<li class="alt"><script type=<span class="string">"text/javascript"</span> id=<span class="string">"bdshell_js"</span>></script></li>
<li><script type=<span class="string">"text/javascript"</span>></li>
<li class="alt">document.getElementById(<span class="string">"bdshell_js"</span>).src = <span class="string">"http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion="</span> + <span class="keyword">new</span> <span class="func">Date</span>().getHours();</li>
<li></script></li>
<li class="alt"><!-- Baidu Button <span class="func">END</span> --></div></div></li>
</ol>
</div>
<h2 id="title-1">二:添加样式代码
<div class="dp-highlighter">
<ol class="dp-c" start="1">
<li class="alt">#divleft{ width:746px; float:left;background-color: #FFF; border: 1px solid #e7e7e7; margin-bottom:8px;overflow:hidden;}</li>
<li>#single_list{ padding:12px; width:722px;float:left;overflow:hidden;}</li>
<li class="alt">#single_list p{ font-size:18px; color:#6da336;line-height:30px;height:30px;overflow:hidden;width:620px;font-weight:bold}</li>
</ol>
</div>
好了,这个效果就出现了,具体的样式自己根据你所使用的主题不同而进行设置,明白
公众微信:idc5ahl
公众QQ:吾爱互联
关注公众微信,公众QQ每天领现金卡密
卡密介绍(http://www.5ahl.com/thread-2182-1-1.html
回复

使用道具 举报

游客
回复
您需要登录后才可以回帖 登录 | 点我注册

快速回复 返回顶部 返回列表