masa'slifelog

お役立ち情報・日常のちょっとした悩み解決!

はてなブログ『スマホのみ』でデザインcss編集方法

f:id:masa0312:20210514130358p:plain

 

 

no-img2
男性

スマホだけで

はてなブログを編集したいけど

上手く出来ない!

今回は、はてなブログスマホのみcssやHTMLの編集が出来ないとお困りの方へ向けて記事を書いていきます!

僕もスマホのみで執筆・編集作業を今でこそ出来る様になりましたが、この方法に出会うまでは苦労しました。

今回の内容

スマホのみでcss.HTMLの編集方法

スマホ編集のデメリット

・参考にさせて頂いたブログ

・オススメcssコピペOKなブログ様

順に説明していきますので、最後までご覧頂けると幸いです。

それでは、いきましょう!

 

              

 

スマホのみでcss・HTMLの編集方法

いざ、cssやHTMLを編集しようと思っても、下の写真のようになってしまいますよね。

f:id:masa0312:20210508193522p:plain

 

 

 

これでは、せっかくコピーしたデザインコードも貼れないし、一文字ずつ手打ちなんて気が遠くなりますよね。

そんな時は辞書入力を使いましょう!

辞書入力とは

予め入力したい単語を登録して、入力の手間を省いてくれるツール

手順

『設定』➡︎『一般』➡︎『キーボード』➡︎『ユーザー辞書』『ユーザー辞書に登録』

※僕はiPhoneユーザーなので、iPhoneの使用例のみになってしまいますがご了承下さい。

手順を画像付きで解説します!

ユーザー辞書へコードを登録

早速使いたいcssコードを登録していきましょう!

f:id:masa0312:20210508193536p:plain

画像のように登録をするとcssみだしと入力すれば予測変換でコードが出てきます。

僕の覚え書きなので、 "1"や"あ"などの単語でも入力は出来ますが、極力わかりやすい方が後で困らないです。

注意点

・コードは必ずメモやドキュメントに保存しておく!

・よみの部分は『確定』を押さずに一気に入力

コードはどれがどれかわからなくならないように、フォルダやシートでわけて保存しておきましょう。

よみの部分は確定を押さずに一気に入力しないと反映されないので、あまり長いと少し面倒になります。

実際にブログデザインを編集する

コードの登録が終わったら実際にcssコードを入力してみましょう!

下の画像で図解してみましたが、もう少し詳しく追記します。

f:id:masa0312:20210514101741p:plain

f:id:masa0312:20210514101747p:plain

デザイン➡︎カスタマイズ➡︎デザインCSSまで進んだら①のように枠内をタップして改行を押しましょう。

そうすると、③のように入力出来るようになるので辞書に登録した“よみ"(今回の例でいう『cssみだし』)を入力しましょう。

"よみ"を入力すると、キーボード部に登録した単語が出て来るので、タップ。

しかし、それだけではデザインコードは入力されないので”よみ"は消去してください。

消去が完了したら、エンター(改行)を押すと画像のようにコードが入力されます。

このように、ユーザーキーボードにコードを登録しておけば、どんどん入力していくことができます!

スマホのみの編集のデメリット

スマホのみで作業ができるので、楽な部分手軽な部分はメリットを感じていますが、デメリットも少なからずあるのでご紹介します。

入力速度が圧倒的に遅い

スマホの入力でも速くは打てますが、どうしてもパソコンのキーボードと比べると遅くなってしまいます。

どっちの方が良いかは個人差もあると思いますが、今後はPCで作業していきたいですね。

CSS・HTMLの編集が面倒

そもそもユーザー辞書に登録して、貼り付ける作業が面倒ですよね。

それと、貼り間違えや入力ミスがあると一気に消すことが出来ず✖️ボタンを一回一回押さないと消せません。

こういう手間を考えるとPCで作業した方が良い時もありますね。

解析ツール等の設定がものすっっごく面倒!

Googleアナリティクスやサーチコンソール等の設定をすると思うんですが、PC画面と違い見づらいは操作し難いはでまー面倒です!

スマホを投げたくなるくらいイライラしました(笑)

悪いことはいいません。PCで作業しょう(笑)

スマホのみで入力をする為に参考にさせて頂いたブログ様

shin5sun.hatenablog.com

『おすすMEMO』を運営するid:shin5sunさん。

shin5sunさん自身もスマホのみでブログ運営をしているそうです。

僕がコメント欄にて質問したところ、さらに詳細の記事も作成して下さいました!

本当にありがとうございました!

デザインにオススメのブログ様

saruwakakun.com

デザインコードの登竜門?初心者向け?といえば『サルワカさん』ですよね!

僕も何度もお世話になっております!

デザインがおしゃれで、コピペだけでも十分ですしコピペしてるだけでデザインの勉強までできてしまう最高のサイトですね!

まとめ

今回は、はてなブログスマホのみで編集、運営していく方法を書き散らかせて頂きました。

質問やご指摘などあればよろしくお願い致します!

それでは、ありがとうございました。