投稿日:

    カテゴリー 日常 / プライベート

    初心者がWordPressを扱えるようになるまでの道のり

    どうも、佐々木です。
    最近無印にハマりました。

    今日は、営業の佐々木がHTMLを勉強して、Wordpressサイトを構築するまでの
    道のりを記録してみたいと思います。
    (まだできていません)

    そんなこんなで、勉強開始です。

    今まで佐々木のHTMLに対する知識は、高校生の頃に課題研究で
    やったっきりです。
    Wordpressは、インストールだけしてテンプレートをそのまま使ったことはあります。
    もちろん全くPHPの知識もありません。

    ダメです

    そう、ダメです。
    ほぼ一からの勉強です。

    とりあえずやってみる

    とりあえずやってみる、ということで、知り合いの
    サイトを作ることにしました。
    当人に許可を取り、ドメイン代を出して頂くことに。
    (サーバー代は僕が借りてるのを使うことに。XServerです)

    請けたもんは仕方ない

    というわけで、勉強です。
    今回、自分で自分のハードルを上げるということで、
    レスポンシブにします、と自分から言ってました。
    が、とりあえず気にせずにPC版でガシガシ作ってみることにしました。

    カルーセルでつまづく

    トップページにカルーセルを配置する、ということで、
    カルーセルプラグインを探したところ、Slick.jsというものを発見。
    これは、と導入してみました。
    ……が。
    全く思ったように動作せず、四苦八苦していました。
    (左右にスライドする矢印が出ない、画像の下の点が異様に下の位置にある等)
    何度配置しなおしてもjQueryのバージョンを変えても同じ。
    これはどうしたものか、とかなり悩みました。

    CSSで案外簡単に解決

    heightで指定してあげたらすんなり思ったように動作するようになりました。
    (矢印は、詰んだので導入しないことにしました。実際のクライアントワークだとダメですね)
    ほっと一安心したのもつかの間、大物が待ってました。

    重鎮「レスポンシブ」

    忘れた頃にやってきます。悪魔。
    前同僚から「メディアクエリを使えばいい」というアドバイスを
    もらっていたのですが、調べても調べてもメディアクエリが何か
    分からない始末。
    その後必死にググってたら、メディアクエリを使わずに、CSSそのものを
    出し分ける方法があり、それを使うことに。
    必死に調整したCSSが、ウインドウ幅を600px未満にした瞬間に無に帰すのは悲しかったです。

    なんとかテンプレート完成!

    見よう見まねで作っては見たものの、なんとかレスポンシブなテンプレートを
    完成させることができました。
    所要時間、大体夜と休日を使って2週間ほど。
    達成感がすごかったです。

    次に待ってるのは、Wordpress

    この次に待ってるのは、Wordpressへの組み込みです。
    これ、全く経験がなく(一応HTML/CSSの経験は会った)、
    本当に怖いです。
    嫌な予感しかしません。

    とにかく頑張ってみる

    何はともあれ、請けてしまったものは完成させるしか無い、
    ということで、頑張って色々やってみます。
    ハマりまくりですが、案外やってると楽しいです。
    主に達成感が。
    というわけで、次にブログ当番が回ってくる頃、サイト完成報告を
    上げることができるように頑張ります!

    では。