< pocket

口コミ機能も作れる!Wixの新機能「Wix Code」を紹介 【カスタム入力フォーム編】

口コミ機能も作れる!Wixの新機能「Wix Code」を紹介 【カスタム入力フォーム編】

多彩な機能を持つ無料ホームページツール「Wix」の新機能「Wix Code」の紹介記事の第3回目になりました。今回は、Wix Codeの機能のひとつ「カスタム入力フォーム」の作り方を解説します。

今回は「カスタム入力フォーム」に加え、これまで紹介したWix Codeの機能「データベース」「動的ページ」を応用して、簡単な口コミサイトを作ってみました。Wixで作ったサンプルサイトに簡単な口コミ機能のサンプルを追加したので、そちらも確認してみてくださいね!

続きを読む
トップに戻る

さくらのサーバーでシマンテックのSSLサーバ証明書を再発行した時の手順6

さくらのサーバーでシマンテックのSSLサーバ証明書を再発行した時の手順6

去年(2017年)、デジサート社(旧シマンテック社)のSSLサーバ証明書をChromeとFirefoxで段階的に無効化されることがGoogleから発表されました。私が契約しているさくらインターネットのラピッドSSLも対象だったため、SSLサーバ証明書を再発行しました。

基本的には最初にSSL対応した時とほとんど同じですが、少し違っているところもチラホラあったため、一連の流れを書き残しておこうと思います。

※さくらインターネットのサーバーで「ラピッドSSL」の証明書を再設定した時の流れです。他のプランやサーバーではこの手順は当てはまりません。

続きを読む
トップに戻る

コーディング速度を上げる!Webサービス・ジェネレーターなどの便利ツール7

コーディング速度を上げる!Webサービス・ジェネレーターなどの便利ツール7

最近ずっとコーディングしてました。長年コーディングしてて、「これがなくなったら困っちゃうな〜」というレベルで手放せなくなったサービスがいくつか出てきて、この機会にまとめておこうと思いました。

また、番外編では忘れがちだけどよく使う様々なcssコードをまとめてくれている記事を紹介します!

続きを読む
トップに戻る

Search Consoleで「インデックス カバレッジ」の問題が発生→Fetch as Googleで解決までの手順

Search Consoleで「インデックス カバレッジ」の問題が発生→Fetch as Googleで解決までの手順

先日、Search Console(サーチコンソール)から「サイト(自分のサイトのURL)で「インデックス カバレッジ」の問題が新たに検出されました」という通知メールが届きました。Googleからのメールってコワイですよね…来た時に思わず身構えてしまいます。

対応してみればどうということもなかったのですが、苦手意識をなくすため、今回は解決までの手順を書き残しておくことにしました。

続きを読む
トップに戻る

データベースから自動でページ作成!Wixの新機能「Wix Code」を紹介【動的ページ作成編】

データベースから自動でページ作成!Wixの新機能「Wix Code」を紹介【動的ページ作成編】

多彩な機能を持つ無料ホームページツール「Wix」の新機能「Wix Code」を複数回にわたって紹介します。今回は、Wix Codeの機能のひとつ「動的ページ」の作り方を解説。

前回の記事ではデータベースを作成しましたが、今回はこのデータベースとテンプレートを連携させ、複数のコンテンツページを作ってみましょう。Wixで作ったサンプルサイト「Waterfall Girl」にサンプルページを追加したので、そちらも確認してみてくださいね!

続きを読む
トップに戻る

無料で大規模Webサイトが作れる!Wixの新機能「Wix Code」を紹介 【データベース作成編】

無料で大規模Webサイトが作れる!Wixの新機能「Wix Code」を紹介 【データベース作成編】

以前に「クリックひとつでサイト公開!「Wix」を使ってブログサイトを作った時の流れ」という記事で、無料ホームページが作れるオンラインサービス「Wix」について紹介しましたが、そのWixから昨年12月に「Wix Code」という新機能が追加されました。

データベース作成やJavascriptの使用が可能になるなどWix Codeの多彩な機能を複数回にわたって解説します。今回は機能のひとつ「データベースコレクション」について紹介。

続きを読む
トップに戻る

Flexboxでスマートニュース(SmartNews)風のレイアウトを実装する方法

Flexboxでスマートニュース(SmartNews)風のレイアウトを実装する方法

かなり前に、スマホ版の関連ニュース一覧の表示をスマートニュース(SmartNews)風にしたいな〜と思い、Flexboxを使って実装してみました。その当時はちょうどFlexboxを覚えたばかりで、個数や画面幅が変わっても柔軟に対応できるのを知って大変感動したのを覚えています。

というわけで、今回はそのとき感じた「知ってよかった!」の気持ちを振り返りながら実装方法をメモしておこうと思います。

続きを読む
トップに戻る

クリックひとつでサイト公開!「Wix」を使ってブログサイトを作った時の流れ

クリックひとつでサイト公開!「Wix」を使ってブログサイトを作った時の流れ

今まで「ホームページ作成ツール」の存在を知ってはいても触れたことがありませんでしたが、先日「Wix(ウィックス)」を使ってみたところ、普段の倍以上のスピードでサイト公開までできてしまいました。

今回は、実際に Wixを使ってWebサイトを制作した流れや使用感などをWebデザイナーの目線から紹介します。

続きを読む
トップに戻る

さくらのサーバーでWordPressをSSL(https://)対応した時の手順10

さくらのサーバーでWordPressをSSL(https://)対応した時の手順10

先日、重い腰を上げてついにサイトをSSL(https:// )に対応しました。やってみれば一つ一つの作業は難しくないのですが手順がなかなか複雑だったので、今回は備忘録として一連の流れや注意点を書き残しておこうと思います。

※ちなみに、今回はさくらインターネットのサーバー(スタンダードプラン)で「ラピッドSSL」を設定した時の流れです。他のサーバーではこの手順は当てはまりません。

続きを読む
トップに戻る

Photoshopいらず!CSSで画像を中央トリミングする方法(レスポンシブ対応)

Photoshopいらず!CSSで画像を中央トリミングする方法(レスポンシブ対応)

最近、会社のサイトをリニューアルする機会があったんですが、サムネイルのサイズがみんなバラバラ!ってことがあったんですよね。今まではそれを横幅だけ揃えて高さはバラバラなまま表示してたりして、なんだか統一感のないデザインだったんですが、そんな悩みを解決してくれるcssを覚えたので、メモとして書き残しておきます!

画像の可変幅にも対応できているので、レスポンシブWebデザインにも使えますよ!

続きを読む
トップに戻る