2021-10-18 15:46:29 +03:00
<section class="gh-canvas">
2022-10-04 08:35:29 +03:00
<GhCanvasHeader class="gh-canvas-header sticky">
<div class="flex flex-column">
<div class="gh-canvas-breadcrumb">
<LinkTo @route="settings">
Settings
</LinkTo>
{{ svg-jar "arrow-right-small" }}
<LinkTo @route="settings.integrations" data-test-link="integrations-back">
Integrations
</LinkTo>
{{ svg-jar "arrow-right-small" }} AMP
</div>
</div>
2021-10-18 15:46:29 +03:00
<section class="view-actions">
2022-02-10 13:20:03 +03:00
<GhTaskButton @task= {{ this .saveTask }} @class="gh-btn gh-btn-primary gh-btn-icon" data-test-save-button= {{ true }} />
2021-10-18 15:46:29 +03:00
</section>
</GhCanvasHeader>
<section class="view-container">
2022-10-04 08:35:29 +03:00
<section class="gh-main-section app-grid">
2021-10-18 15:46:29 +03:00
<div class="gh-main-section-block app-detail-heading app-grid">
<div class="app-cell">
<img class="app-icon" src="assets/img/amp.svg" />
</div>
<div class="app-cell">
<h3>AMP</h3>
<p>Accelerated Mobile Pages</p>
</div>
</div>
</section>
<div class="gh-main-section">
<h4 class="gh-main-section-header small bn">AMP configuration</h4>
<section class="gh-main-section-block">
<div class="gh-main-section-content grey">
<div>
<div class="gh-setting-first {{ unless this .settings .amp "gh-setting-last" }} ">
<div class="gh-setting-content">
<div class="gh-setting-title">Enable AMP</div>
2022-02-02 19:09:43 +03:00
<div class="gh-setting-desc mb0">Enable <a href="https://ampproject.org" target="_blank" rel="noopener noreferrer">Google Accelerated Mobile Pages</a> for your posts</div>
2021-10-18 15:46:29 +03:00
</div>
<div class="gh-setting-action">
<div class="for-checkbox">
<label for="amp" class="checkbox">
<input
type="checkbox"
checked= {{ this .settings .amp }}
id="amp"
name="amp"
onclick= {{ action "update" value = "target.checked" }}
data-test-amp-checkbox
>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
</div>
{{ # liquid-if this .settings .amp class = "" }}
<div class="gh-setting-last gh-setting-amp-liquid">
<div class="gh-setting-content gh-setting-content--no-action">
<div class="gh-setting-title">Google Analytics Tracking ID</div>
<div class="gh-setting-desc">Tracks AMP traffic in Google Analytics, find your ID <a href="https://ghost.org/help/how-to-find-your-google-analytics-tracking-id/">here</a></div>
<div class="gh-setting-content-extended">
2022-12-08 20:04:20 +03:00
<GhFormGroup class="no-margin" @errors= {{ this .settings .errors }} @hasValidated= {{ this .settings .hasValidated }} @property="ampGtagId">
2021-10-18 15:46:29 +03:00
<GhTextInput
@placeholder="UA-XXXXXXX-X"
@name="amp_gtag_id"
@value= {{ this .settings .ampGtagId }}
@keyEvents= {{ hash
Enter=(action "save")
}}
/>
<GhErrorMessage @errors= {{ this .settings .errors }} @property="ampGtagId"/>
</GhFormGroup>
</div>
</div>
</div>
{{ / liquid-if }}
</div>
</div>
</section>
</div>
</section>
</section>