对网页分享技术的思考

提高网页浏览量是提高网站信息影响的前提,提高网页浏览量的方式是多种多样的,其中向特定页面添加网页分享是一个很好的主意,网页分享实现方式很多,这里介绍一下百度分享的应用:

一、百度分享相关网址:

获取代码:http://share.baidu.com/code

帮助文档:http://share.baidu.com/help

二、百度分享之图标式:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>图标式</title>
	</head>

	<body>
		<!-- Baidu Button BEGIN -->
			<div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare">
		        <a class="bds_qzone"></a>
		        <a class="bds_tsina"></a>
		        <a class="bds_tqq"></a>
		        <a class="bds_renren"></a>
		        <span class="bds_more">更多</span>
			</div>
			<script type="text/javascript" id="bdshare_js" data="type=tools&mini=1" ></script>
			<script type="text/javascript" id="bdshell_js"></script>
			<script type="text/javascript">
				var bds_config = {
					'bdText':'分享内容',
					'bdComment':'分享评论',
					'bdPic':'http://avatar.csdn.net/E/A/D/1_wangshuxuncom.jpg'
				};
				document.getElementById('bdshell_js').src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000);
			</script>
		<!-- Baidu Button END -->
	</body>
</html>

三、百度分享之文字式:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
    String skinId = request.getParameter("skinId");
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>文字式</title>
		<style type="text/css">
			a{
				text-decoration: none;
			}
		</style>
	</head>

	<body>
		<div class="bdsharebuttonbox">
			<a href="#" class="bds_more" data-cmd="more">分享到:</a>
			<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间">QQ空间</a>
			<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博">新浪微博</a>
			<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博">腾讯微博</a>
			<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网">人人网</a>
			<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信">微信</a>
		</div>
		<script type="text/javascript">
			window._bd_share_config={
				"common":{"bdText":"分享内容","bdComment":"分享评论","bdMini":"2","bdMiniList":false,"bdPic":"http://avatar.csdn.net/E/A/D/1_wangshuxuncom.jpg","bdStyle":"0","bdSize":"16"},
				"share":{"bdSize":16},
				"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到:","viewSize":"16"},
				"selectShare":{"bdContainerClass":"bdsharebuttonbox","bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}
			};
			with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
			</script>
	</body>
</html>

三、百度分享之浮窗式

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<title>浮窗式</title>
		<script type="text/javascript">
			window._bd_share_config={
				"common":{"bdText":"分享内容","bdComment":"分享评论","bdMini":"2","bdMiniList":false,"bdPic":"http://avatar.csdn.net/E/A/D/1_wangshuxuncom.jpg","bdStyle":"0","bdSize":"16"},
				"slide":{"type":"slide","bdImg":"6","bdPos":"right","bdTop":"250"},
				"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到:","viewSize":"16"},
				"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}
			};
			with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
		</script>
	</head>

	<body>

	</body>
</html>

五、遇到的问题及其解决方法:

①、我的工程名为shareDemo,项目通过Tomcat发布,http输入http://localhost:8080/share/index.html,然后选择并点击“分享到QQ空间”,可是出来的界面不能显示分享内容(如下图),但是其它分享好用:

图片4-1-1

解决方法:这种问题并不是你的代码写错了,而是QQ做了限制——如果http请求中为localhost,那么是不会返回结果的,可以通过将localhost改为计算机IP地址或者改为127.0.0.1解决这个问题。

②、使用浮窗式百度分享时,用IE打开相应的页面,没有发现所谓的“浮窗”啊,其它浏览器(譬如火狐、谷歌或者Safari)都好用?

解决方法:嗯嗯嗯,这个问题我也曾经遇到过,几经研究发现是页面文档类型搞的鬼——研究发现如果为“<!DOCTYPE
HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">”,则在IE或者360浏览器中浮窗式的百度分享会不好用——显示不出来;如果为“<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">”则在IE或者360浏览器中浮窗式的百度分享会比较好的显示出来;

补充性说明:上面列出的三个例子是最简单的例子,要弄清每个参数什么意思以及其它的一些配置,请访问官方网站。

0分下载资源

对网页分享技术的思考

时间: 2024-10-21 00:33:57

对网页分享技术的思考的相关文章

对FreeMarker技术的思考

按照静态非静态来划分网页分为两种:静态网页和非静态网页,究其优缺点而言,静态网页在用户访问的时候响应快,但是由于里面的数据是写死的,所以致命的缺陷就是数据不能动态显示:非静态页面(如jsp)数据可以动态显示,可以这样理解,这样的页面就是显示数据的一个模板,但是由于在用户请求得到响应以前,服务器端需要将其解析为浏览器可识别的html语言,这个解析过程需要耗费时间(尤其页面数据量大的时候,耗费的时间会更多),所以致命的缺陷就是请求发出后响应的过程较慢.那么有没有一种方法或工具自动生成静态网页呢?答案

AppCan开源之道:分享技术价值 连接企业和App开发者

在当今世界的IT舞台上,最闪耀的光芒来自那些软件开源公司,比如跻身10亿美金的红帽公司,将开源模式推向极致的Facebook.而市场对开源的态度也是积极的,据Gartner研究显示,2013年拥有较低成本的开源软件,将以22.4%的增长速度,达到81亿美元的规模.越来越多的实践表明,开源是软件厂商成为领袖级公司的必然之路. 据某著名媒体针对开源所做的CIO调查,38%的CIO认为开源所带来的优势是开发自主性强,其余则为:33%节约成本,13%安全性好,10%广大的技术支持等.CIO们.开发团队.

微信网页分享

在微信中分享某个网页,如果不调用微信的接口,分享的网页会默认显示.默认的标题是网页的title,图片会默认选取网页中大于300*300的图片,如果图片小,取不到图片,在微信中会显示默认的灰色图案.网页的简介部分会默认为网页的链接.调用微信的接口以后,分享的标题.图片.简介都可以自定义设置.下面结合在项目中的开发实践,简要总结一下如何进行微信接口的调用,实现自定义网页分享. 调用微信接口,就是进行微信公众平台的开发,主要参考微信公众平台技术文档,https://mp.weixin.qq.com/w

静态网页开发技术-HTML

今天我重新复习了一下静态网页开发技术,概括如下. 一 .HTML文档结构与基本语法 :放置了标签的文本文档,可供浏览器解释执行的网页文件 1.注释标记 2.标记 3.属性 二.基本标记与使用 1.网页基本结构与标记 2.文本与段落标记 3.列表标签 4.超链接标签 5.图片标记 6.定时刷新或跳转 7.表格 三 HTML表单标签与表单设计 1.<FORM>标记及其属性 2  <INPUT>标记及其属性 3 <下拉列表框<SELECT>,<OPTION>

android网页分享到朋友圈问题求助?

目前想要实现通过QQ将网页分享到微信好友或朋友圈,看见有些APP是直接分享出去左下角图标显示的是QQ.求助各位大牛提供下思路. 这种功能是怎么实现的.应该不是通过android的系统分享实现的吧?.查了几天的资料仍然没有思路,求助各位大牛 这种功能是怎么实现的.应该不是通过android的系统分享实现的吧?.查了几天的资料仍然没有思路,求助各位大牛 这种功能是怎么实现的.应该不是通过android的系统分享实现的吧?.查了几天的资料仍然没有思路,求助各位大牛 这种功能是怎么实现的.应该不是通过a

【反传销】春节一个短暂误入传销和脱身的真实故事以及对技术的思考(一)简单的开始与症状

这是一段真实的,沉甸甸的经历,就发生在今年2015春节前后.希望看到这篇文章的每一个人 仔细读完,理解,并转发给身边的人,让你的家人出门之前一定要注意.同时也可以给已经有陷入传销的家人,你们可以做的一些事情.作为一个喜欢技术的,看完之后也思考了一些问题,如何能在法律允许的范围内,通过手机等设备,保护自身及家人的安全,希望大家一起交流. 自由诚可贵,且行且珍惜. 为了当事人的隐私,下面的故事的任务和地点,进行了缩写,大家基本可以猜测到: LotA :我和当事人工作的城市,是一个浙江沿海城市: Lo

开通博客,分享技术心得!

开通博客,分享技术心得! 2013-05-13 开通博客,分享技术心得!,布布扣,bubuko.com

如何以Java实现网页截图技术

今天看到某网友关于"如何以Java实现网页截图技术"的咨询帖,由于出现该咨询的地点非常不适合较长回复,故以博文形式回答. 事实上,如果您想以Java实现网页截图,也就是"输入一段网址,几秒钟过后就能截取一张网页缩略图"的效果.那么,您至少有3种方式可以选择. 1.最直接的方式--使用Robot 方法详解:该方法利用Robat提供的强大桌面操作能力,硬性调用浏览器打开指定网页,并将网页信息保存到本地. 优势:简单易用,不需要任何第三方插件. 缺点:不能同时处理大量数据

微信网页分享标题图片自定义设置(最新)

1 前言 刚好有微信网页分享标题图片自定义设置这个需求,然后查找文档,发现有两种方案[1],但是第一种方案已经失效了,只能走第二种方案,然后根据实战配置好了,本文会写上配置中遇到的问题和解决方案,也作为记录使用,方便自己也方便他人. 2 步骤 2.1 准备工作 2.1.1 微信JS-SDK说明文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 2.1.2 附录6-DEMO页面和示例代码:在JS-SDK说明文档中