WordPress初めて半年ちょっとですが、「CSS Wapuu Shortcode」という公式プラグインを作っちゃいました。

カバー画像はspicagraphさん（@spicagraph)に作っていただきました！

めっちゃいいの作ってもらった！！

ありがとうございます！！

プラグインについて

「CSS Wapuu Shortcode」はHTMLとCSSで描かれたわぷーをショートコードで記事や固定ページに埋め込めるプラグインです。

プラグインを有効化して、ショートコードを書くだけです。

scale=数字でサイズ変更もできます。

基本サイズが400×400pxで、scale=0.5で200×200px、scale=10で4000×4000pxになります。

200pxサイズ

keyframeでまばたきさせてます。

これだけのプラグインです。
ホントはもっとやりたいことはあるんですが、初めてのプラグインで開発もやったことないので、とりあえずここまでで今後機能追加やってみたいです。

また、scaleで小さくしたわぷーを追加すると、下に余白ができると思いますが、
.css-wapuuにマイナスマージンかけて無理やり狭めてください。(*_ _)人ｺﾞﾒﾝﾅｻｲ

.css-wapuu {
  margin-bottom: -80px;
}

きれいに使えるようにし試行錯誤します。。

あと、ちょっとした遊びで色を変えたりできます。
後々、まゆげとかで表情つけるようなことできたらと考えてます。

.css-wapuu .body,.css-wapuu .body::before,.css-wapuu .body::after,.css-wapuu .face,.css-wapuu .face::after,.css-wapuu .face::before,.css-wapuu .left-hand,.css-wapuu .left-hand::before,.css-wapuu .right-hand,.css-wapuu .left-leg,.css-wapuu .left-leg::after,.css-wapuu .left-leg::before,.css-wapuu .left-foot,.css-wapuu .left-foot::after,.css-wapuu .left-foot::before,.css-wapuu .right-foot,.css-wapuu .right-foot::after,.css-wapuu .neck,.css-wapuu .neck::after,.css-wapuu .neck::before {
    // 体の色指定
	background-color: #E67168;
}

他にも、こんなことやったら面白いっていうのあれば、ぜひ教えてください！

配布に関して

プラグインの配布は公式ディレクトリで行っています。

css-wapuu-shortcode

また、GitHubでソースを公開しています。
プルリクもお待ちしてます！

GitHub

ライセンスは、GPL バージョン 2 またはそれ以降の互換ライセンスとなり、プラグインやテーマ内での使用も可能です。
ただし、著作権はキャラクター作成者のカネウチカズコさんが保有します。

いつの間にか”Get Involved”されていた！！

そもそもCSSわぷーを作ったのは、WordCamp Kansai 2015の記事の企画です。

海外でも人気のわぷーをCSSで作ってみました！

去年の12月から本格的にWordPressの勉強を始め、今年はWordPressについて学ぼうと思った一環で、WordCamp Kansai 2015の実行委員に参加しました。

WordCamp Kansai 2015のテーマは“Get Involved”
こちら実行委員長のカイトさん（ @ixkaito ）より

“Get Involved” は Make WordPress ページへ導くためのメニューではありますが、しかしその実際の意味はもっと広く、そして様々な言葉に訳すことができます。今回 “Get Involved” をテーマに掲げたのも、そんな想いを込めています。WordPress を支えている開発者、貢献者にスポットを当てていますが、そうでない方にも、「参加しよう」「出会おう」「交わろう」「巻き込まれよう」と言った様々な形で WordPress に関われる場にしたいと思います。
WordCamp Kansai 2015 開催概要

実行委員内で広報チームに属していて、このテーマに沿った何の記事を書こうと考えてました。

それでCSSわぷーを思いついたわけですが、なんでCSSでわぷーを描いてみたかというと、WordPressやったことない人や初心者にも来て欲しいというのが個人的にずっと思っていて、
CSSでイラスト描くのは流行ってたし、Web初心者でHTMLやCSSぐらいしか分からないという人にも興味持ってもらえるかなと思ったからです。

それがどれぐらい効果があったかは分かりませんが、実行委員をはじめいろんな方に話題にしていただいて、英語版の記事を作ってもらったりして、海外の人にも反応をもらえました。

そして、あれよあれよという間にWordCamp Kansai 2015が終わりました。

WordCamp楽しかったなーと燃え尽きていたところ、
WordBench京都の岡本さん(@motchi0214)から「プラグインつくっちゃいなYo！」的なノリで言われて、プラグイン作りをしてみることに。

「サイトの拡張性を飛躍的に高める WordPressプラグイン開発のバイブル」(宣伝）を買ったり、いろんなサイトを参考にしたり、分からないところを聞いたりしながら、なんとか公式ディレクトリに登録！

ここ１ヶ月ぐらいで「コミュニティ」と「プラグイン開発」のバッジがつきました！

WordPressアカウント

WordPressを知りたいと思って何気なく始めた実行員ですが、プラグインまで作っていつの間にかGet Involved”されちゃっていました。

プラグインをつくってみて

ひょんなことから作ったプラグインですが、作る過程でいろんな方から反応いただくのがすごく楽しかったですし、WordPressのコミュニティにもとても感謝してます。

プラグインを作ったのも背中を押してくれたり、分からないところを教えてくれたり、修正してプルリクくれたり。
わぷーを作ったカネウチさんにも感謝です。わぷーがいなければそもそも何も始まってなかった（笑）。
いつかお会いしたいなぁ。

こうしたWordPressのコミュニティはすばらしいですし、作り続けた人たちもありがたいです。

WordCamp Kansaiの実行委員をしていると、WordPressへの貢献しようとか感謝しようという言葉を聞いて、最初は正直ちょっと身構えちゃうところもありましたが、コミュニティに飛び込んでみるとすごく自然にそれをやっている感じでした。

プラグイン開発もWordPressへの貢献の一つですが、興味と技術を勉強したいということからやったことが、結果的に貢献になってる感じです。

WordPressを通じてたくさんの人と出会いましたし、これからもどんどん繋がっていきたいなと思います。（このプラグインを翻訳してもらったり、開発を手伝ってもらったり、いろいろできそう！）

WordPress歴半年ちょっとの自分でも、プラグイン開発者になれたし、「WordPressやったことない…」「Webの経験浅いから…」という人でも、どんどんWordPress（に限らずいろんな技術やそのコミュニティ）に関わって欲しいなと思います。勉強会に顔を出してみるだけでも。

自分でちょこちょこ勉強して得ることより、コミュニティで得られることの方がは想像以上に大きいですよ！

IE8は非対応です（お決まりの）。