Javascriptの事を調べているとソースコードをcodepenで書いて埋め込んでいる記事・ページが結構ありますね
見た目もデザイン的で訪問者としても結構わかりやすく使いやすい感じでした
https://codepen.io/
codepenの始め方
試しにコードを書いてリアルタイムでの実行結果を表示する事だけなら登録なしでも可能です
ブログ記事に埋め込む等の機能を使うには無料アカウント登録が必要ですがメールアドレスとパスワード、ユーザー名の登録だけでOKでした
Gmailで登録してしばらく経ちますが届いたのはウェルカムメール２通だけでスパム的なメールはなさそうです
codepenの簡単な使い方
作成画面はレスポンシブです
コードタイトルはデフォルトではコードURLになってますが、編集可能で日本語もOK
コンソールログも表示出来るのでデバッグ確認にも使えます
codepenのブログへの埋め込み方
埋め込みコードを取得するには画面下部の「Embed」ボタンから
このコードをブログ記事にコピペするだけですね
確認画面で選択されているコードがデフォルトで表示するコードになり、高さの調節も可能です
0 件のコメント :
コメントを投稿