Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.




<style amp-custom>
body { color: #333; … }
</style>


<style amp-custom>
<?php
include “css/amp.css";
?>
</style>
var replace = require('gulp-replace');



gulp.task('sass', function () {
…

.pipe(replace('!important',''))
.pipe(replace...


<script async custom-element=“amp-analytics” src=“https://cdn.ampproject.org/
v0/amp-analytics-0.1.js”></script>
…
<amp-an...

 













1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
1から始めるAMP対応
Upcoming SlideShare
Loading in …5
×

1から始めるAMP対応

WCAN 2016 Winter のライトニングトーク枠でお話しした内容です。わたしがAMP対応したときに困った点についてエンジニア目線で主にピックアップしています。

  • Login to see the comments

  • Be the first to like this

1から始めるAMP対応

  1. 1. 

  2. 2. 
 <style amp-custom> body { color: #333; … } </style> 

  3. 3. <style amp-custom> <?php include “css/amp.css"; ?> </style>
  4. 4. var replace = require('gulp-replace');
 
 gulp.task('sass', function () { …
 .pipe(replace('!important','')) .pipe(replace('@charset "UTF-8";n','')) @charset “UTF-8"style.scss
  5. 5.
  6. 6. <script async custom-element=“amp-analytics” src=“https://cdn.ampproject.org/ v0/amp-analytics-0.1.js”></script> … <amp-analytics type=“googleanalytics” id=“analytics1”>
 <script type=“application/json"> { “vars": { "account": “xxxxxxxxx(トラッキングID)" }, “triggers": { “trackPageview": { “on": “visible", “request": “pageview" } } 
 

  7. 7. 
 
 
 
 

  8. 8. 
 

  9. 9.

×