新浪博客悬浮窗口_悬浮代码_漂浮挂件制作方法

作者:神奇的周 | 创建时间: 2023-07-13
新浪博客是国内公用免费博客里功能最强大、使用权限最自由、内容限制尺度最小、收录排名都很高的平台,不管是把新浪博客当成自己的日志空间来更新的,还是为了展示自己热衷的话题的,或者是为了做企业、网站、产品推广宣传的人都很多。有很多博主可能都有这样...
新浪博客悬浮窗口_悬浮代码_漂浮挂件制作方法

操作方法

打开新浪博客,登陆,再点击“页面设置”

"页面设置"的后台出现后,先点击"自定义组件",再点击"添加文本组件"

"文本组件"的编辑器出现后,建议选择"窄栏",然后点击"显示源代码",并在中间的正文输入框里填入以下这段代码: <a target="_blank" href="您所需链接的网站地址或者比如商务通之类的在线对话窗口地址"><img src="您所需在悬浮窗口中使用的图片链接地址" style="posiTion: fixed; Top: 200px; right: 5px"></a> 把代码中的汉字部分换成汉字要求的内容即可。 其中 您所需在悬浮窗口中使用的图片链接地址必须是已经上传到网上或者服务器中,以图片格式结尾的网址,比如XXXX.jpg,XXXX.gif等等,把这个地址复制过来粘贴于此,注意无法通过上传本地图片来达成。 200这个数字代表的是这个图片在网页中的高度,可在完成代码添加后进行预览,直至效果满意; right这个单词代表的是悬浮窗口位于右侧,如果需要使悬浮窗口位于左侧,把这个单词换成left即可;如果左右两边都要放悬浮窗口,则可以如本步骤3的图2所示,使用两次代码,一次左边的代码,一次右边的。

代码输入完毕后,把勾选的"显示源代码"取消,然后给这个组件命名,另外可以在已经显示的图片上方写上一句提示词之类的话(可以不写),再点击"预览",看看效果是否满意,不满意就进行相应的修改,满意后点击"保存"。

最后如本步骤5的图1所示勾选你的这个悬浮窗口组件,确保处于显示状态;然后如图2,点击鼠标左键不放把组件的固定位置拖到满意的地方(悬浮窗口已经显示并能随屏飘动,拖动这个固定的组件位置不影响悬浮窗口),一切妥当后如图3点击保存,最终效果如图4所示。

温馨提示

图片地址可以通过对网页中的图片点击鼠标右键,选择"属性"的方式获取
左右两边的悬浮窗口可以分别链接不同的地址和图片,在左边和右边的代码中分别输入各自的网址和图片地址即可
组件必须命名,否则无法提交
点击展开全文

更多推荐