任意の要素のリンクに「shutto:view('pc')」と記述すると、shuttoで変換されていない元の表示に切り替えることができます。
・設定例
https://shutto.com/edit/zwuQnFB
上記例では、アイコンは画像アップロード機能でアップしCSS編集で見栄えを調節しています。
アイコンを使わず、テキストをボタンのようにすることもCSSの調整で可能ですので、設定例をご参照ください。
画像、またはテキスト等の要素に対して鎖アイコンからURLを設定します。
アイコンを使わず、テキストをボタンのようにすることもCSSの調整で可能ですので、設定例をご参照ください。
画像、またはテキスト等の要素に対して鎖アイコンからURLを設定します。
【ご注意】
「PC表示」のリンクだけ設置し、次で説明する「スマホ表示」を設置しないと、PCページ表示からスマホページ表示に戻れません。必ずPCページ表示から「スマホ表示」に戻るボタンとセットで設置するようにしてください。
「PC表示」のリンクだけ設置し、次で説明する「スマホ表示」を設置しないと、PCページ表示からスマホページ表示に戻れません。必ずPCページ表示から「スマホ表示」に戻るボタンとセットで設置するようにしてください。
PCページからshutto変換されたページに表示を変える
逆に、shuttoのタグが埋め込まれている元PCページで以下のjavascriptを実行することで、端末を問わず強制的にshuttoで変換されたページを表示させることもできます。
__shutto.view('mobile')
「shutto対応端末 ＋ shuttoで変換設定が作られている」条件を満たしているか判断するカスタム属性
data-shutto-display="match"
上記を組み合わせることで、PC向け表示からshuttoで変換された表示への切り替えボタンは次のように書けます。
<div data-shutto-display="match" style="display: none;"><a href="javascript:__shutto.view('mobile')">スマホ向け表示</a></div>
※このボタンの表示条件は対象となるページに、①shutto変換スクリプトが設定されている、②該当するページ用に変換設定がされている、③PC向け表示のタグ（上のタグ）が入っている、ことになります。
この機能で表示を切り替えた場合、shuttoの変換を行うかどうかの設定はブラウザのセッションが切れるまで（通常はブラウザを閉じるまで）保存されます。
・設定例
https://recommend.submit.ne.jp/
【shutto変換ページ】
【shutto変換ページからPCページへ切替】
この例では、shutto変換ページから「PC版」ボタンで元の表示に切り替わり、切り替わったPCページからshutto変換ページに戻れるように、PCページ上部に「スマートフォン向け表示」リンクを追加しています。
※リンクの追加は、元ページのHTMLに記述します。
※リンクの追加は、元ページのHTMLに記述します。
※2012年9月28日更新。以前の「__shutto.match()」を使ったAPIは新導入方式（JavaScriptファイルアップロード形式）でご利用いただけませんので、上記方法に差し替えていただくようお願いいたします。
・以前ご案内していたjavascriptタグ方式の切替リンク
<script type="text/javascript">
if (window.__shutto && __shutto.match() && !__shutto.converted())
document.write("<div><a href="javascript:__shutto.view('mobile')">スマートフォン向け表示</a></div>");
</script>
※2012年8月2日更新
以前はifの部分を「if (/iphone|android/.test(navigator.userAgent.toLowerCase()))」とご案内しておりましたがshutto対応端末を判別するAPIを公開したため変更しております。
旧書き方をご利用中のお客様は新しい記述に変更いただくようお願い申し上げます。
