CodePen で jQuery設定

公開日: : wordpress

codepen

html、css、Javascriptのコードを書いたら画面半分に動作結果を表示してくれて、しかも自分のサイトに埋め込みができるサービス の中でも有名なCodePenというサービスがあります。このサービス、デフォルトではjQueryは動作しないのですが、1つ設定するだけで動作可能となります。その設定手順を記します。

設定手順

画面右上のSttingsを選択

codepen

赤枠の部分に「jQuery」と入力

codepen

候補が出てくるので「jquery」を選択

codepen

cloudflareにポストされたjqueryのURLが入ったことを確認

codepen

### 保存を忘れずに。右下 緑色の「Save & Exit」ボタンを押下する。

codepen

 

これで「js」テキストエリアにjQueryのコードを入力すれば動作が確認できます。

以上。

Googleアドセンスレスポンシブ

関連記事

ワードプレスのロゴ

WordPressのフックを使ってカスタマイズする場合、子テーマでやること

add_actionやadd_filterなどの関数を使ってカスタマイズしたいとき、テーマ(テン

記事を読む

ワードプレスのロゴ

WordPressのプラグイン 古いバージョン入手

やり方 wordpress.org プラグインのページ 開いて、「developer」タブをク

記事を読む

ワードプレスのロゴ

本番で公開しているWordPressのコピーをDockerで作る際のポイント

基本 ファイルとDBのバックアップを取得する。 バックアッププラグイン(BackWPUpとか

記事を読む

ワードプレスのロゴ

サイトヘルスで「バックグランド更新が想定通りに動作していません」と表示される原因のひとつ

  結論 僕の場合は、Basic認証をかけている為でした。  

記事を読む

ワードプレスのロゴ

contact form 7 送信ボタンでリセットされる→送信ボタンがぐるぐるまわって終わらない

環境:静的htmlにcontact form 7 をショートコードで埋め込み WPのテーマ使わ

記事を読む

ワードプレスのロゴ

WordPressのadd_actionとdo_action、ついでにadd_filter

※注意 この記事は正確性にかけます。 add_action フィルターに関数を追加する

記事を読む

ワードプレスのロゴ

WordPress CLIでドメイン変更

やり方を解説してくれてるサイトさんのリンク https://onoredekaiketsu.c

記事を読む

ワードプレスのロゴ

静的htmlでContact Form 7を使用する

ショートコード設置まで .htaccessの内容変更や、htmlソースの最上部(docty

記事を読む

ワードプレスのロゴ

WordPressのClassicエディタでインデントが勝手に消える

対応 「TinyMCE Advanced」というプラグインをインストール 上記プ

記事を読む

ワードプレスのロゴ

WordPress ページのスラッグを指定してパーマリンクを取得する

やり方 <a href="<?php echo get_permali

記事を読む

Googleアドセンスレスポンシブ

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

Googleアドセンスレスポンシブ

Windows10で ipsec vpn 設定後に更に必要になる設定 [自分用メモ]

完全に自分用メモです。   VPNの設定 &nbs

webp コマンド で 画像変換やリサイズ

webpとは Googleが開発した画像形式。 非可逆圧縮で圧

tux logo
HDD完全消去方法いろいろ(有料、無料、Linuxコマンド)

仕事でNSA方式(ランダムx2 と 0埋め)のデータ消去が必要にな

tux logo
ubuntu の Live DVDでキーボードの配置をjis(日本語)にする

キーボードの配置をjis(日本語)にする場合 loadkeys

zip icon
zipコマンドでzipファイル作成 再帰的

やり方 zip -r zipファイル名.zip 圧縮対象のファイ

→もっと見る

PAGE TOP ↑