静的なHTMLをそこそこ制作する案件があったので EJSを試しに使ってみました。 複数ページの情報をJSONで管理し、 テンプレートエンジン“EJS”でHTMLを書き出してみます。 こちらのページを参考にさせていただきました。 Gulp+EJS+JSONからHTMLファイルを生成する ▼環境
![EJS+gulpで静的サイトのHTML生成 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/d1d89e1c58d1f5b063da136ddb82c728fe4ee7fa/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9RUpTJTJCZ3VscCVFMyU4MSVBNyVFOSU5RCU5OSVFNyU5QSU4NCVFMyU4MiVCNSVFMyU4MiVBNCVFMyU4MyU4OCVFMyU4MSVBRUhUTUwlRTclOTQlOUYlRTYlODglOTAmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPTQ4MjZhYjlmYzZiOTFhNDkxOWJjZGZlZjkyNTQ5Y2Jm%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBvZGVuJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz05N2Q4MTFiNmJhZTEyM2MzYWRiOWZlMGM1ODc5NmIxMg%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Db53ddf9518a7ec250471cd136a051eaf)
WordPressの管理画面で設定した項目や作成した記事内容などの各種データは、「データベース」に保管されます。この記事では、データベースの基礎知識についてご紹介します。 WordPressを使うにはデータベースが必要 データベースは、さまざまな情報を保管し、抽出・加工などができるソフトウェアです。WordPressでは、管理画面から入力したコンテンツデータ(記事のタイトルや本文など。くわしくは後述)をデータベースに保管する仕組みとなっています。 データベースにはいくつかの種類があり、WordPressではMySQLというデータベースを使います。データベースはWordPressを使う上で必須のもので、サイト管理者自身が用意しなければなりません。
サイトを移転するときには、Google先生の教え通りに301リダイレクトをしないと、きちんと移転したということを認識してもらえません。Google Search Console(旧:Webmaster tools)で引越しするときには、その点もちゃんとチェックされるので、超重要です。 また、よくあるのがWordPressなどのCMSを使っていて、パーマリンク設定をする際に http://ドメイン/%category%/%postname%/ という言う風にカテゴリ名をURLに入れちゃっている場合があります。しかし、これをしてしまうとカテゴリの入れ替えやカテゴリ名の変更をした時に、URLが変わってしまうためにリンク切れを起こします。 私は以前まさしくこれをやっていたので「カテゴリ名に左右されないパーマリンクに変えたい!!」と思ったものの、この問題にぶつかってパーマリンクの変更を断念しました。
Redirection プラグインはあるURLを別のURLへリダイレクトさせる設定ができるプラグインです。 Apache などの Web サーバを使用している通常のサイトであれば「.htaccess」ファイルを使ってリダイレクトの設定を記述しますが、このプラグインを利用すれば「.htaccess」ファイルを編集する必要がありません。ここでは Redirection プラグインのインストール方法と使い方について解説します。 Redirectionプラグインのインストール Redirectionプラグインをインストールにするには「プラグインのインストールと有効化」プラグインのインストールと有効化」を参考に「プラグインのインストール」画面を表示し検索ボックスで「Redirection」と検索されて下さい。 「Redirection」プラグインが表示されましたら「いますぐインストール」と書かれたリ
301リダイレクトは、”Permanent Redirect”で「恒久的な転送」、一方、302リダイレクトは、”Temporary Redirect”で「一時的な転送」を表します。 恒久的?、一時的? 分かるようでよく分からない表現です。 サーチエンジンの取り扱い方に違いが出てくるのですが、たとえばSERPでの表示(インデックスの仕方)が異なってきます。 以前、GoogleのWebmaster Centralチームで働いていたVanessa Foxさんがパーソナルブログで、301リダイレクトと302リダイレクトのケーススタディを記事投稿しているので、見てみましょう。 彼女は、「www.vanessafoxnude.com」というドメインで「Vanessa Fox Nude」というサイトを運用していました。 しかし数ヶ月前に「www.nineblue.com」というドメインの「Nine By
例えば「テーブルA」に格納されているデータに対して、wpdbを使って検索フォームに入力された文字列に合致した結果を出力したくなりました。その時、検索の柔軟性を持たせるために、「あいまい検索(LIKE演算子)」ができるように実装したかったんですが、少し手間取りましたのでメモ書きました。 wpdbを使って「あいまい検索」まずは「あいまい検索」とは何かを確認します。 あいまい検索とは例えば、データベースの検索言語であるSQLでは、LIKE文を用いて、検索対象文字列が部分一致するようなレコードを抽出することができる。 (引用:あいまい検索とは 「曖昧検索」 (fuzzy string searching) あいまいけんさく: – IT用語辞典バイナリ) というわけで、今回やりたいことそのものでした。 WordPressのwpdbを使って「あいまい検索」を実装例えば、テーマフォルダ内に検索結果表示用
いつもGMO WP Cloudをご利用いただき、ありがとうございます。当ブログでは、WordPress(ワードプレス)運営者や設置者が多く取り組まれている「WordPress(ワードプレス)カスタマイズ」に関しても、ささやかながら主要なTIPSをご提供させていただき、WordPress(ワードプレス)業界を少しでも盛り上げていければと思っております。 なお私達「GMO WP Cloud」は、WordPress(ワードプレス)に最適なサーバを月900円ご提供しています。制作会社様の納品に。WEB担当者様のお供に。ぜひ、ご検討くださいませ。 WordPress(ワードプレス)のデータベースは知っていますか? 本日は少し難易度の高いWordPress(ワードプレス)のお話を致します。ただ、初心者の方においても、「WordPress(ワードプレス)を使いこなしている人は、こんな使い方もしている!」
タイトルを取り出したいので「post_title」というフィールドですね。 複数行のレコードを取り出す場合は「get_results」関数を使用します。 SQL文は「get_results」の引数に記述します。 通常のMySQLのように「FROM テーブル名」と記述してもいいのですが、テーブル名の「wp_」という接頭辞はインストール時に変更できるため柔軟なテンプレートを作成するなら直接指定しない方が良いようです。 Wordpressでは代わりに各テーブルに対応したプロパティ名で指定します。 プロパティ名は基本的にテーブル名から接頭辞(デフォルトではwp_)を除いたものになります。「wp_posts」なら「posts」ですね。 では、テンプレートの適当なファイルに下記を記述して実行してください。 WordPress テンプレートファイル $results = $wpdb->get_resul
Webページやスマホアプリで見かけるレイアウト、ナビゲーション、ボタン、スライダー、フォーム、タイムライン、ボタンなど、CSSを使って実装されたテクニックがまとめられたコンテンツを紹介します。 デザインのアイデアとして、またそれが実装可能かどうか、実装はどうやっているのか、何かあった時にチェックすると便利です。
おはようございます、小野寺です。 みなさん、会議や打ち合わせのときに議事録をとると思います。 相手との認識のズレを防いだり、決定事項を周知したりするのに非常に重要だと思います。 ただ正直、議事録とるのってめんどくさくないですか? せっかく作った議事録もあまり読まれてなかったり…なんてのもよく聞く話。 そんなめんどくさいことは機械に任せて、もっと会議に集中したいものです。 今回はまさにそんなことをしてくれる議事録作成AI『clarke.ai』を紹介します。 これは、会議の生産性を変えるかもしれません。 サマリーだけでなくToDo管理も。めちゃくちゃできる書記AI“clarke.ai” clarke.aiは会議の音声を認識・分析し、議事録を作ってくれるツールです。しかも、ただのメモをするのではなく、会議で、何が重要で、でてきたタスクをだれがいつまでにしないといけないか、などまで整理してまとめて
追記 この記事を書いた当初はまだIE対応をしなければならないケースが多かったのですが、最近はもうIE対応は考えなくていいかなと思ったので今風の書き方を追記しました。 サムネイルの画像サイズがみんなバラバラ・・・ サムネイルの画像サイズがバラバラだと、どうしても表示に統一感がなくなってしまいますよね。Pinterestのような、サムネイルのバラバラ感を逆に活かしたレイアウトであればいいのですが、使い所が限られてきます。 かといって、複数個ならまだしも何百、何千とある画像をリサイズするのは手動でも自動でも大変…!というわけで、cssで中央部分をトリミングして同じサイズで表示してみましょう! CSSで画像を中央でクロップして同じサイズで表示する方法 以下が実装用のコードです。「CSS」のタブをクリックして確認してみてくださいね。 方法1:object-fit版 「object-fit」というプロ
プロの技を間近で体験できるVRピアノレッスンが登場 Courtesy of テオミルン teomirn
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く