Html

Web開発をしていると遭遇するはみ出る要素。
モバイル用の表示など画面サイズを小さくすると発生するWebページが横スクロールできてしまう厄介なやつです。

セキュリティーなどの都合で、フォームから送信されてきた文字列の中にHTMLやjavascript,cssの文字列があったらエスケープしたい。 というのをPythonでやってみます。

デザインの都合でbuttonタグではなく、aタグを利用したい場合があります。

そんなときに使える方法を残しておきます。

aタグでPOSTする方法

<form method="post" name="form_1" id="form_1" action="data/post">
    <input type="hidden" name="user_name" placeholder="ユーザー名">
    <a href="javascript:form_1.submit()">リンク名</a>
</form>

hrefの値をフォームにしてあげるのが、一番簡単そう。

最近ではもはや当然のページ内リンクをクリックするとスルスルーっと移動するアニメーションの実装の仕方を紹介しようと思います。

HTML

<a href="#top">トップへ移動</a>

HTML側は特別な設定は必要ありません。
普通にページ内リンクを貼るだけでokです。

最近はではほとんどのサイトでSNSでシェアするボタンが付いているのを目にします。
というわけで自分のサイトにも実装してみます。

シェアボタン設置前にやるべき事

シェアボタンを設定する前に下記の事項を確認しておきましょう！

はじめに

なぜ自動保存機能を付けようと思い至ったかと申し上げますと、
先日、30分くらいかけて編集していたメモ(当サイト記事)を更新する時、ネットワークのエラーで送信に失敗**「書いていた内容を全喪失する」**という悲しい事故が発生いたしました。

やりたいこと

このサイトにもコードを張り付けることがあるわけですが、そのままではどうにも見づらい。
というわけで、markdownをシンタックスハイライト付きでHTMLにできたらいいなぁ

このサイトのメモの内容はマークダウンで書き込んでいるのですが、
何件か書き込んだあたりで「普通のフォームだと書きづらい」、「編集しながらどんな見た目になるのか確認したい」と思いました。
そこで、今回は、JavaScriptで簡単にサイトにマークダウンエディタが組み込める「SimpleMDE」をご紹介します。

超簡単

pip install markdown

でインストールして

import markdown as md
html = md.markdown("#markdown")

これだけ

一応拡張機能でシンタックスハイライト対応もできるみたいだけど今回は割愛。
気が向いたら追記するかも

別メモ書きました markdownをシンタックスハイライト付きでHTMLにしてみる