在百度联盟代码位管理中创建好对应的代码位之后,点击获取代码,会看到这样一段js

直接复制粘贴到自己网页中便可显示对应广告。

在vue中由于都是vue组件,不支持直接在组件中加入这样一段一段的js代码,我们采用如下方法:

1、首先在index.html中引入生成的代码中的js,

2、在vue组件中在想要显示广告位代码的地方写一个 <div id="ad_1"></div>

3、在对应的组件的mounted钩子中加入以下函数:

//悬浮样式
(window.slotbydup=window.slotbydup || []).push({
id: 'u319733',
container: 'ad_1'
});

id为生成的代码中的cpro_id,container为创建的div的id

到此,广告已经可以展示。

参考链接:https://segmentfault.com/q/1010000007738867

vue如何加入百度联盟广告的更多相关文章

  1. vue如何加搜狗联盟广告

    搜狗联盟广告和百度联盟广告大同小异,但是好在百度联盟广告的使用方法网上还是可以找到一些,而搜狗联盟广告的教程网上几乎找不到,都是最基本的创建代码位的教程. 在vue中如果要加入搜狗联盟广告,就不能直接 ...

  2. 移动端网页使用flexible.js加入百度联盟广告样式不一致问题解决

    flexible.js是淘宝推出的一款移动端手机自适应的库,源码内容很简洁,当网页使用了该库之后,页面会在head中加入对应的页面响应式的meta标签. 当使用flexible.js的时候,引入百度联 ...

  3. 百度联盟广告 http://cpro.baidustatic.com/cpro/ui/c.js

    <script src="http://cpro.baidustatic.com/cpro/ui/c.js" type="text/javascript" ...

  4. vue如何加入百度ssp广告位代码

    vue如何加入百度联盟广告,可以参考 :http://www.cnblogs.com/beileixinqing/p/8379184.html 这里讲述vue如何加入百度ssp媒体的广告 这里是百度异 ...

  5. Google AdSense的CPC点击单价超百度联盟(2014)

    很久没有关注AdSense了,一是访问不太方便,二是网站投放AdSense广告相当少,估计每天收入都不到1美元,所以就懒得去看了,一般都是几个月才去看一看. AdSense还行吗? AdSense点击 ...

  6. 广电的宽带网络真流氓,替换google的广告为百度的广告

    以前联通也有干过这事,最近联通,有没有继续干,不清楚.没有用联通了. 最近,连到某wifi,发现网站的google广告,居然显示成百度的,特别去访问另一家网站,发现,本该是google广告的位置,同样 ...

  7. Vue中使用百度地图——设置地图标注

    知识点:创建Map实例,为指定的位置设置标注 参考博客:https://www.cnblogs.com/liuswi/p/3994757.html 1.效果图:初始化地图,设置指定经纬度为地图中心点坐 ...

  8. Springboot+Vue实现仿百度搜索自动提示框匹配查询功能

    案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...

  9. vue中引入百度统计

    vue作为单页面的,引入百度统计,需要注意不少. 一.基本的流量统计 在index.html 入口文件中引入百度统计生成的一连串代码: var _hmt = _hmt || []; (function ...

随机推荐

  1. python.pandas read and write CSV file

    #read and write csv of pandasimport pandas as pd goog =pd.read_csv(r'C:\python\demo\LiaoXueFeng\data ...

  2. DataTable的一些特殊用法:Select

    当你从数据库里取出一些数据,然后要对数据进行整合,你很容易就会想到: 1DataTable dt = new DataTable();//假设dt是由"SELECT C1,C2,C3 FRO ...

  3. [openssl]openssl特定版本安装

    卸载旧版本 OpenSSL1. apt-get purge openssl2. rm -rf /etc/ssl #删除配置文件编译与安装 OpenSSLprefix 是安装目录,openssldir ...

  4. AT24Cxx(EEPROM)子系统

    1.配置内核 打开I2C功能: 打开杂项设备,该选项打开后,EEPROM也就打开了. 2. 修改代码 修改文件: linux/arch/arm/mach-s3c2440/mach-smdk2440.c ...

  5. Android——Fragment过度动画分析一(转)

    Sliding Fragment 作者:小文字 出处:http://www.cnblogs.com/avenwu/   介绍:该案例为传统的Fragment增加了个性化的补间动画,其效果是原有frag ...

  6. CDH版本java开发环境搭建

    1. maven设置 除了阿里云库,还需要引入 cdh, spring库.需要修改maven下面的配置文件setting.xml, 参考下面设置. <mirror> <!--This ...

  7. Oracel扩展表空间

    --表空间查看 SELECT tbs, sum(totalM) as total, sum(usedM) as UserdM, sum(remainedM) as remainedM, as User ...

  8. 【linux】——ubuntu12.04 下安装wine和wine乱码解决方案

    ————————安装最新ppa的wine———————— sudo add-apt-repository ppa:ubuntu-wine/ppa sudo apt-get update sudo ap ...

  9. Android开发-httpclient兼容性问题

    据说android 6.0之后已经将Apache Http Client移出SDK,build时出现“Unable to find optional library: org.apache.http. ...

  10. Java学习路线图,Java学习计划建议

    怎么学习Java,这是很多新手经常遇到的问题,现在我简单描述下一个Java初学者到就业要学到的一些东西:     首先要明白Java体系设计到得三个方面:J2SE,J2EE,J2ME(KJAVA).J ...