从零开始 – 让你的Page更加美观更加有趣 第一课 (从安装到一般的标签代码…)

  • A+
所属分类:广告投放

原创文章,转载请注明Ada的外贸SNS营销博客
工欲善其事必先利其器,要想有一个完整的美观的页面首先我们必须安装 Static FBML 这个应用,所有的静态页面都必须要求安装.

(PS.在顶部的搜索栏当中输入FBML就可以看到了,如图

从零开始 – 让你的Page更加美观更加有趣 第一课 (从安装到一般的标签代码…)

选择安装到Page一路允许就可以了.)

然后在PageLogo下方的Edit Page里面的Apps中可以找到一个FBML应用默认的tab,点击Go to App

即可开始编辑内容.如果想要添加多个标签,在标记页面保存按钮旁边点击添加另一个标签就可以了.

首先给tab新建一个标题如:Wellcome,然后保存,这样我们回到Page就看到一个新的Wellcome标签

FBML支持的最大宽度是520px,高则没有要求,可以自己定义DIV,宽度超出的部分会被隐藏,影响美观.

下面我们开始装饰我们的Page

关于页面的内容,最好是图片+文字的形式,不要纯文字或者纯图片.加上必要的排版即可达到我们的要求.

首先我们给wellcome这个标签下面加一张图片

现在PS里面处理好图片,然后上传到图床当中,获取URL

比如:http://platform.ak.fbcdn.net/www/app_full_proxy.php?app=4949752878&v=1&size=o&cksum

=cf0610027d0f35e922bedaef442688b1&src=http%3A%2F%2Fwww.banggood.com%2Ffacebook%2Fhomebeauty%2Ftest3.gif

大小为520*100px的一张banner.

从零开始 – 让你的Page更加美观更加有趣 第一课 (从安装到一般的标签代码…)

要在FBML中显示我们可以用传统的A标签

<空格a href="http://yaosocial.com/"><空格img src="图片地址" width="520" height="100" alt="图片"空格>

或者用一个DIV把它包起来方便定位

文字内容可以直接输入或者是用

标签,还可以用CSS定义文字样式,大小,颜色,阴影等

下图是我编辑完成的初步页面

从零开始 – 让你的Page更加美观更加有趣 第一课 (从安装到一般的标签代码…)

上面我定义几种文字样式,还用H2来提示让大家尽量用火狐或者google内核的浏览器,这样可以避免很多兼容性问题.

下一篇文章当中我会跟大家一起制作一些深入一点的特效.比如在标签内实现如下效果

从零开始 – 让你的Page更加美观更加有趣 第一课 (从安装到一般的标签代码…)

具体效果大家可以翻墙到我的Page上面观看演示.
原创文章,转载请注明Ada的外贸SNS营销博客

  • 我的微信
  • 扫一扫添加好友
  • weinxin
  • 我的微信公众号
  • 优乐学舍服务号
  • weinxin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:4   其中:访客  3   博主  1

    • 小屁人 小屁人 1

      来看看,嘻嘻,链接已经添加,多多交流哦

      • ecigs ecigs 0

        这歌很实用,我至于一个最原始的page,一直没想到用FBML去设计自己独特的页面

          • sunnysada sunnysada Admin

            @ecigs 有空多来看看,会有持续更新的哦

            • Gertrude Gertrude 0

              @ecigs Stands back from the keyboard in ameazenmt! Thanks!