a-blog cms でampに対応する

32

Upload: kasumi-morita

Post on 16-Apr-2017

435 views

Category:

Internet


0 download

TRANSCRIPT

Page 1: a-blog cms でAMPに対応する
Page 2: a-blog cms でAMPに対応する
Page 3: a-blog cms でAMPに対応する
Page 4: a-blog cms でAMPに対応する
Page 5: a-blog cms でAMPに対応する
Page 6: a-blog cms でAMPに対応する
Page 7: a-blog cms でAMPに対応する
Page 8: a-blog cms でAMPに対応する
Page 9: a-blog cms でAMPに対応する
Page 11: a-blog cms でAMPに対応する
Page 12: a-blog cms でAMPに対応する
Page 13: a-blog cms でAMPに対応する
Page 14: a-blog cms でAMPに対応する

<!-- BEGIN_MODULE Touch_Entry -->

<link rel=“amphtml" href="%{CANONICAL_URL}/tpl/

amp.html"><!-- END_MODULE Touch_Entry -->

! !"

Page 15: a-blog cms でAMPに対応する

“author”: {

“@type”: “Person”,

“name”: “◯◯” // 著者の名前を記入

},

Page 16: a-blog cms でAMPに対応する

<script type="application/ld+json"> {

“headline”: “<!-- GET_Rendered id=“title” —>", “description”: “<!-- GET_Rendered id=“meta_description" —>”,

… }

Page 17: a-blog cms でAMPに対応する

<!-- BEGIN_MODULE Entry_Summary id="ogp_summary" -->

Page 18: a-blog cms でAMPに対応する

<amp-iframe src="https://www.slideshare.net/

slideshow/embed_code/key/{slide_id}" width="595" height="485" layout="responsive"

sandbox="allow-scripts allow-same-origin allow-

popups" allowfullscreen frameborder="0"> </amp-

iframe>

Page 19: a-blog cms でAMPに対応する

<style amp-custom> <!-- #include file=“/css/amp.min.css —> </style>

! !

Page 20: a-blog cms でAMPに対応する

var replace = require('gulp-replace');gulp.task('sass', function () { … .pipe(replace('!important','')) .pipe(replace('@charset \"UTF-8\";\n',''))

@charset “UTF-8"acms.css

Page 21: a-blog cms でAMPに対応する
Page 22: a-blog cms でAMPに対応する
Page 23: a-blog cms でAMPに対応する
Page 24: a-blog cms でAMPに対応する

"

Page 25: a-blog cms でAMPに対応する
Page 27: a-blog cms でAMPに対応する
Page 28: a-blog cms でAMPに対応する
Page 29: a-blog cms でAMPに対応する