Upgrade to Pro — share decks privately, control downloads, hide ads and more …

PHPとかよくわかんない系WEBデザイナーでもShifterでいろいろできたよ! というお話。

PHPとかよくわかんない系WEBデザイナーでもShifterでいろいろできたよ! というお話。

Shifterオンラインミートアップでお話しさせてもらった、WEBデザイナー目線の経験談です。

Mariko Imamura

May 20, 2020
Tweet

More Decks by Mariko Imamura

Other Decks in Design

Transcript

  1. PHPとか
    よくわかんない系WEBデザイナー
    でもShifterで
    いろいろできたよ!
    というお話。
      Sourire web studio 今村真理子

    View Slide

  2. 自己紹介
    今村真理子
    神戸でフリーランスのWEBデザイナーしてます。
    2児のオカンです。
    ここ数年はバイクツーリングにハマってます。
    デザインして構築して、サイト制作してます。
    PHPはおまじないだと思ってます。
    @kamesanzzz
    https://sourire-web-studio.com

    View Slide

  3. こんなのとか

    View Slide

  4. こんなのとか

    View Slide

  5. こんなのとか 作ってます。
    ゴテゴテ装飾多めの女性子供向けのデザインが得意です。

    View Slide

  6. デザイナーの
    Shifter悲喜こもごも話です

    View Slide

  7.   わたしのShifterデビュー
    前知識ゼロで神戸のミートアップに参加
    Shifterは『なんか便利なやつ。らしい。』
    という程度の認識でした。

    View Slide

  8.   うれしかったポイント
    WordPress簡単インストールよりも簡単

    View Slide

  9.   ハマったポイント
    独自ドメインでハマる
    定番のやつです
    お約束のように独自ドメインの登録ができませんでした。

    View Slide

  10. サポートがめっちゃ頼りやすい!早い!
      うれしかったポイント

    View Slide

  11.   ハマったポイント
    メールアドレスが使えない
    Shifterに登録した独自ドメインのメールアドレス、どうしよう。
    AWSはちょっとハードルが高い

    View Slide

  12. サイトはShifterへ、
    メールはエックスサーバーにDNSを設定
    Shifter エックスサーバー
    独自ドメイン.com

    View Slide

  13.   ハマったポイント
    ContactForm7が使えない
    『WP Serverless Forms』を使いこなせなかった

    View Slide

  14. Googleフォームを入れ込みました
    Googleフォーム

    View Slide

  15. Generateしないよ!
      ハマったポイント

    View Slide

  16. 修正したものの、再度試したGenerateも進まず。
    テーマにエラーがあるよ

    View Slide

  17. 古くて更新されてないプラグインを削除
    プラグインにもエラーがあるよ

    View Slide

  18. 無事にGenerateできました!

    View Slide

  19.  この時の学び
    テーマとプラグインの
    PHPチェックをきちんとする
    『PHP Compatibility Checker』でお手軽チェック。
    https://ja.wordpress.org/plugins/php-compatibility-checker/

    View Slide

  20. FTPは使えない
    プラグインがエラーになったので止めたいんやけど・・・
      ハマったポイント

    View Slide

  21. Safe Modeがありました
    プラグインを全部無効化した状態で無事にログイン。
    該当プラグインを削除して
    めでたしめでたし。
      うれしかったポイント

    View Slide

  22. 続。FTPは使えない
    テーマ内の画像差し替えとかcssとかめっちゃ触りたい
      ハマったポイント

    View Slide

  23. テーマとGitHubの連携
    GitHubと連携することで更新ができるプラグイン
    『Shifter Github Plugin/Theme Installer』

    View Slide

  24. が、しかし。

    View Slide

  25. Githubの超基本的なことがわかってないと
    説明書きの意味がわからない
    説明はとっても丁寧に書かれてます。
    https://www.digitalcube.jp/shifter/10479/

    View Slide

  26. 例えば

    View Slide

  27. 『.github/workflows/release.yml』
    のファイルを自分のリポジトリにコピーして・・・という手順
    『ファイルを新規で作ってコピペする』の
    やり方がわからない

    View Slide

  28. FTPみたいに階層ごとにフォルダを作るのかなー?と思ってやってみたら違うし
    そもそもフォルダってどうやって作るんやろ?Create fileってフォルダやないよなあ。
    どこにコピペしたらええんやろ??うーん管理画面意味がわからん・・・
    ※この時点でアップロードも新規追加も知りません
    ? ?
    ?
    これが初心者です。お恥ずかしい。
    一度こころ折れました。Shifter関係ないけど。

    View Slide

  29. その他にも

    View Slide

  30. GitHub Actionsも理解してなかった
    動作完了を待つために小休憩することで解決

    View Slide

  31. 最初に更新通知を見た時の感動は
    言い表せません
    めっちゃ達成感。

    View Slide

  32. テーマとGitHubの連携が
    Shifter最大の難関でした
    でも、なんとかクリア!

    View Slide

  33.  実際にサイトを運営してみて
    Shifter、サイト管理がめっちゃ楽ですね。

    View Slide

  34. セキュリティとか気にしなくていいし。
    表示もめっちゃ早い。

    View Slide

  35. トラブった時に
    サポートに気軽に相談できるという安心感。

    View Slide

  36. デザイナーも、怖がらずに使ってみて欲しい
    エンジニアじゃなくても使えるよ!

    View Slide

  37. ありがとうございました

    View Slide