ランディングページ（LP）を作ってみた
ランディングページについては広告ページくらいの認識でしたが、意味的には訪問者が最初にアクセスしたページらしいですが、ほとんどの場合で商品やサービスを売る為に作られた縦長のワンページのことらしいです。たまに見かけますね。もう型というのが出来上がってるので見た瞬間に「あっ広告サイトや」とわかるあれです。 本物のランディングページを見ると勉強に...
パーツを組み合わせてレスポンシブなサイトを作った
2018年7月28日 CSS BootstrapcssHTMLデザイン
過去の３つの記事で、記事一覧部分のデザイン、ヘッダーメニュー部分のデザイン、なんかスライダー部分のデザインを作りました。 これらの３つの記事の応用で一つのレスポンシブなサイトを作ってみました Bootstrapとフレックスボックスで記事一覧部分のデザインを作る 記事やコンテンツが流れていくスライダーのアレを作ってみた オーバーレイをかけた...
オーバーレイをかけたスライドメニューを作った[簡単]
2018年7月28日 jQuery cssHTMLjQueryスライドメニューデザイン
レスポンシブデザインを意識すると、ボタンを押したら横からメニューが出てくるスライドメニューを考えたりします。 メニューが表示されている時は、オーバーレイをかけて画面全体を暗くして、メニュー以外のどこかをクリックしたらメニューを閉じる。みたいな感じのを作ります。 スライドメニューを作る 前回記事やコンテンツが流れていくスライダーのアレを作っ...
記事やコンテンツが流れていくスライダーのアレを作ってみた
2018年7月28日 jQuery bxslidercssHTMLjQueryスライダーデザイン
ブログとか見ているとトップページに、オススメの記事などが流れているスライダーを見かけます。今回はそれを作りました。画像スライダーというかコンテンツスライダーと呼ぶのでしょうか？とにかくあれです。自作すると大変そうなので、bxsliderというjQueryのプラグインを使いました。 コンテンツスライダーを作る まずは作ったデモサイトをご覧く...
Bootstrapとフレックスボックスで記事一覧部分のデザインを作る
2018年7月28日 CSS BootstrapcssHTMLデザインワードプレス
ワードプレスのテーマを自作している時に、トップページに新着記事一覧を表示することが多いのですが、その記事一覧部分のデザインは非常に重要ですね。どんな記事なのか知る前に、視覚的に見やすいか見やすくないかという情報が入ってきてしまうので考えて作るべきです。 記事一覧部分を作る まずはBootstrapを使って作るパターンと、Bootstrap...
テーマカスタマイザでカラーコントロールを使って色を指定する
2018年7月27日 ワードプレス カスタマイズワードプレス自作テーマ
ワードプレスの自作テーマを作ってたんですが、テーマカスタマイザというのを最近知りました。 テーマカスタマイザとはヘッダー画像とか設定する「外観」→「カスタマイズ」の部分です。プレビュー見ながらテーマの設定を変更する画面のことです。 これは視覚的にテーマをカスタマイズできるので、初心者でもテーマカスタマイズをしやすくなるというメリットがあり...
Laravel5.6で画像投稿機能を使ったユーザー投稿型サイトを作った
2018年7月25日 Laravel LaravelPHP画像
Laravelは今アツいPHPのフレームワークです。(私はcakeとか使ったことないですが...)そんなわけでLaravelを使ってユーザー投稿型のサイトを作りました。 コンセプトは猫を救うです。野良猫とか迷い猫とか里親を探している猫とか、そういった猫に手を差し伸べていこうというサイトです。 ユーザーが猫に関する情報を投稿してレスポンスを...
ワードプレスの管理画面に設定項目を追加する
2018年7月16日 ワードプレス オプションカスタマイズテーマワードプレス管理者メニュー
今、新しいテーマを作っているのですが、管理画面に値を設定させるフィールドを用意しています。そんなわけで管理画面で独自の値を設定する方法を本投稿で書いていきます。これができると、カスタマイズの幅が広がります。ここはクライアントが入力した値を使いたい！という場面で役に立ちます。 以前も似たような記事を書いたのですが ワードプレスの設定画面に項...
ワードプレスの記事投稿画面のエディタにボタンを追加する
2018年7月15日 ワードプレス tinymceエディタボタンワードプレス
ワードプレスのテーマを作っていると、記事投稿画面で便利な機能を追加したいと思う時があります。プラグインを追加すれば簡単にできるのでしょうが、今回は自作で作っていきます。ちなみにこのブログテーマは自作テーマ(KYO)なのですが、数種類のボタンを自作しています。 ビジュアルエディタにボタンを追加する functions.phpに以下のように書...
