在百度联盟代码位管理中创建好对应的代码位之后,点击获取代码,会看到这样一段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. Maven 解决 下载项目 compiler 为1.5的问题

    在 开发Maven 项目的时候,会发现个问题,就是下载下来的项目默认 compiler 为1.5 ,项目报错. 明明之前开发用的是1.7的啊. 这里只需要在pom.xml确定下就好了. <pro ...

  2. A. Counterexample (Codeforces Round #275(div2)

    A. Counterexample time limit per test 1 second memory limit per test 256 megabytes input standard in ...

  3. 怎样用Google APIs和Google的应用系统进行集成(2)----Google APIs的全部的RESTFul服务一览

    上篇文章,我提到了,Google APIs暴露了86种不同种类和版本号的API.我们能够通过在浏览器里面输入https://www.googleapis.com/discovery/v1/apis这个 ...

  4. 微信web开发者工具同时打开两个小程序项目

    在写小程序时,想要一边参考别人的Demo一边做,但是微信web开发者工具无法同时开两个实例,怎么办? 单个软件实例来回切换打开的项目太麻烦,一种办法是同时下载[微信web开发者工具]和[微信web开发 ...

  5. STM32 双ADC同步规则采样

      最近需要用到两个ADC对电压电流进行同步采样,看了一下STM32的ADC介绍,发现STM32最多有3个独立ADC,有在双AD模式下可以进行同步测量,正好满足我的要求.参考官方给的例子在结合自己的需 ...

  6. Go Revel - Results(响应)

    每个`Action`必须返回一个`revel.Result`实例,用来处理响应.它遵循了简单的接口: type Result interface { Apply(req *Request, resp ...

  7. DCGAN in Tensorflow生成动漫人物

    引自:GAN学习指南:从原理入门到制作生成Demo 生成式对抗网络(GAN)是近年来大热的深度学习模型.最近正好有空看了这方面的一些论文,跑了一个GAN的代码,于是写了这篇文章来介绍一下GAN. 本文 ...

  8. 主流HTML5游戏框架的分析和对比

    本文主要选取了Construct2.ImactJS.LimeJS.GameMaker.CreateJS.lycheeJS.Crafty.three.js.melonJS.Turbulenz.Quint ...

  9. Java编程的逻辑 (8) - char的真正含义

    本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http:/ ...

  10. Codeforces Round #256 (Div. 2) B (448B) Suffix Structures

    题意就是将第一个字符串转化为第二个字符串,支持两个操作.一个是删除,一个是更换字符位置. 简单的字符串操作!. AC代码例如以下: #include<iostream> #include& ...