サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Wikipedia
webnetamemo.com
Flex動作を有効にする まずは、d-flexまたはd-inline-flexクラスを設定し、Flexコンテナーを作成します。 d-flex
WordPressの投稿や固定ページに何度も同じパーツを使いたいときに便利なのがプラグイン「Insert Pages」。情報が変わったときベースのページだけ修正すればいいので、共通で使いたいパーツにおすすめです。 Insert Pagesのインストール WordPressの管理画面サイドメニューより「プラグイン」の「新規追加」を選択。プラグインの検索で「Insert Pages」を検索し「今すぐインストール」>「有効化」にします。 Insert Pagesの使い方 固定ページで共通パーツを作る まずは、固定ページで共通パーツを作っておきます。 例)タイトル「共通パーツ」、パーマリンク「sampleparts」という名前で固定ページを作りました。 Insert Pagesの表示方法 クラシックエディタ(ビジュアルエディタ)の場合 表示させたいページのビジュアルエディタ「insert page
レンタルサーバーに設置したWordPressにプラグインContact Form 7を利用すると、Office365に設定された独自ドメインのメールが送信できませんでした。さくらやGmail、xserverだと大丈夫だったのに・・・。そんなときプラグイン Cimy Swift SMTPで「指定したSMTPサーバーを使うように切り替える」ことで対応できましたのでご紹介いたいます。 メールサーバー:office365 独自ドメイン:お名前.comで管理 ホームページのサーバー:さくらインターネット Cimy Swift SMTP設定方法 1. Cimy Swift SMTPのインストール まずは「プラグイン」「新規追加」より「Cimy Swift SMTP」をインストールしてください。 2. Cimy Swift SMTPの設定 サイドメニューの「設定」より「Crimy Swift SMTP」
呼び出し元URL https://○○○.com/contact/?your-name=テストA ContactForm7のフォーム設定 default:getでGETデータを表示することができます。 [text* your-name default:get] 結果 こんな感じでテキストエリアにデフォルトでGETデータが入った状態でフォームに表示できます。 readonly readonlyを指定すると編集不可にすることができます。値も送信できます。テキスト選択も可能です。 [text* your-name default:get readonly] disabled disabledを指定すると同じく編集不可にすることができますが、値は送信できません。テキスト選択もできません。 [text* your-name default:get disabled]
WordPressのカスタムメニューwp_nav_menuをBootstrap4のメニュー対応させたい場合...
まずはRewrite機能をONにしてURLの書き換えを可能にします。一度ONにしておけば毎度書かなくてOKです。初期値はoff。 URL書き換えのベースになるURLを指定 htaccessが設置されたディレクトリを基準にします。転送元ではなく、転送後のURLを基準にします。 リダイレクトの書き方 ページ単位のリダイレクト 例)旧URL http://example.com/old.html 例)新URL http://example.com/new.html
文字の色 text-**** 文字の色を変更してくれるクラスです。 Bootstrap4では.text-secondary .text-light .text-dark .text-whiteクラスが追加されました。 .text-primary .text-secondary .text-success .text-danger .text-warning .text-info .text-light .text-dark .text-muted .text-white <p class="text-primary">.text-primary</p> <p class="text-secondary">.text-secondary</p> <p class="text-success">.text-success</p> <p class="text-danger">.text-dan
/* Extra small devices: Phones (<768px) */ @media (max-width: 767px) {} /* Small devices: Tablets (≥768px) */ @media (min-width: 768px) and (max-width: 991px) {} /* Medium devices: Desktops (≥992px) */ @media (min-width: 992px) and (max-width: 1199px) {} /* Large devices: Desktops (≥1200px) */ @media (min-width: 1200px) {} /* Extra small devices: Phones (<576px) */ @media (max-width: 575px) {} /*
固定ページのテンプレートを変更する方法はありましたが、WordPress4.7以降「投稿」ページのテンプレートを変更する方法も簡単にできるようになったようです。 テンプレートの作成 1. single.phpのコピー デフォルトで利用している投稿ページテンプレート single.php をコピーして single-XXX.php お好みの名前に変更します。 ※名前はたぶんsingle.phpでなくても大丈夫だと思います。とりあえずわかりやすくsingle.phpをコピーして利用。 2. コメントを追加 single-XXX.php を開いて上部にコメントを追加します。
グレーの枠(廃止) well グレーの囲み枠を表示してくれるクラスでしたが、Bootstrap4ではなくなりました。 パネル(廃止) panel panel-default パネルクラスもBootstrap4ではなくなりました。 カード bootstrap4では.well .panel .thumbnailクラスはなくなり、.cardクラスに統一されました。 card Card title Some quick example text to build on the card title and make up the bulk of the card’s content. Go somewhere <div class="card" style="width: 20rem;"> <img class="card-img-top" src="..." alt="Card image ca
画面サイズ別 Bootstrap4では画面サイズ毎にクラス分けもできるようになりました。 class画面サイズ
Bootstrapのナビゲーションバー(navbar-nav)のメニューをセンター寄せにする方法です。 イメージ図 目次 […]
パネル panel panel-default .panel .panel-default でパネルを、.panel-bodyで余白を作ってくれます。 デフォルトのパネル
ボタン btn btn-*** <button>ボタン要素や <a>アンカー要素のクラスに.btn .btn-***を指定することでボタンを表示することができます。 基本 <!-- Default --> <button type="button" class="btn btn-default">Default</button> <!-- Primary --> <button type="button" class="btn btn-primary">Primary</button> <!-- Success --> <button type="button" class="btn btn-success">Success</button> <!-- Info --> <button type="button" class="btn btn-info">Info</button> <!-
text-muted text-primary text-success text-info text-warning text-danger <p class="text-muted">...</p> <p class="text-primary">...</p> <p class="text-success">...</p> <p class="text-info">...</p> <p class="text-warning">...</p> <p class="text-danger">...</p>
ol.list_parentheses{ padding:0 0 0 2em; margin:0; } ol.list_parentheses li{ list-style-type:none; list-style-position:inside; counter-increment: cnt; } ol.list_parentheses li:before{ display: marker; content: "(" counter(cnt) ") "; }
GoogleMap API V3のカスタマイズ方法 カスタマイズにはGoogle Map API V3を利用します。 ※jQueryを使用した方法になります。 1. htmlにjavascriptの追加 htmlの下の方。/bodyの直前?あたりに貼りつけ。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> $(function(){ // マップ設定 var latLng = new google.maps.
Bootstrap3の <table> には標準クラスで用意されているものがあるのでまとめてみました。
PageSpeed Insightsの「ユーザー補助」内で表示された内容の対処方法になります。 ...
var getDevice = (function(){ var ua = navigator.userAgent; if(ua.indexOf('iPhone') > 0 || ua.indexOf('iPod') > 0 || ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0){ return 'sp'; }else if(ua.indexOf('iPad') > 0 || ua.indexOf('Android') > 0){ return 'tab'; }else{ return 'other'; } })();
売上があった場合の仕訳はどのように記入するのでしょうか?複式簿記の場合、書き方が意外と面倒なのでメモしておきました。ご参考ください。 月末締め、翌月末に振り込まれる場合 例えば、ホームページ1ページ作成で10,000円分の売上があった場合、6月中に納品+請求書の発送、7月末に振り込まれるケースを例にしてみました。 源泉徴収なしの場合 6月に納品し、6/30に請求書の発行をした場合 作成するタイミングは請求書を発行した日。貸方で売上「請求書」を渡し、借方で支払いを約束「売掛金(未回収の代金)」イメージとなります。 借方貸方取引日勘定科目補助科目金額勘定科目補助科目金額摘要
// Classes .pull-left { float: left !important; } // Usage as mixins .element { .pull-left(); }
IcoMoonでアイコンフォントを作る IcoMoonは好きなアイコンを選んでアイコンフォントにできるサービスです。IcoMoonで用意されているアイコンにもLINEなどはなかったので画像を読み込んでフォント化する方法をやってみました。 1. SVGファイルを読み込む 「Import Icons」からSVGファイルを読み込みます。 アイコンはこちらのサイトで配布されていましたので利用させていただきました。 ブログのデザインでも使用している「Webフォントアイコン」を本当にオススメしたい! https://douraku.sw2x.com/note/web-font-icon/ 2. フォントファイルをダウンロード 読み込んだアイコンを選択して「Generate Font」をクリック。 フォントに名前を付けます。ダウンロードしてきたSVGファイルには名前がついていたのでこのままでもOKです。
このページを最初にブックマークしてみませんか?
『Webお役立ちネタ帳 | Web制作に役立つ情報まとめサイトです。』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く