ホーム » ブログ

 サイトに無料SSLサーバ証明書「Let's Encrypt」の導入

  • 2017/04/21

本記事では、さくらレンタルサーバで無料発行できるLet's EncryptのSSLサーバ証明書の導入により、サイトをhttps化する方法が公開します。

グーグルはhttps対応しているかは、サイトの検索結果が上位に表示ための１つの要因となっています。
ビジネスまたは法人サイトの大半は既にhttps暗号化対応している、一方、個人サイトのhttps対応は未だ少ないと思います。
なぜなら、SSLサーバー証明書の導入はコストかかるから。ベリサインみたいのＳＳＬサーバー証明書の年間更新費用は１０万近く、個人サイトとしては大きいコストですね。
ラッキーなのは、世の中で無料なSSL証明書があります！それは【let's encrypt】です。

下記の手順を見ながら、あなたのサイトにもhttps対応していきましょう。…

続く...

 CSSで(小)見出しのデザイン例まとめ

  • 2017/04/19

ホームページ開発にてタイトル・見出しなどに対して、どのようにデザインすればいいでしょうか。また、画像利用か画像なしてCSSのみでデザインするかを悩んでいる方は少なくありません。本記事ではCSSのみでタイトルや小見出しのデザインサンプルを公開します。
下記のデモページを見てください。
気になる方は、下記のコードをコピペのみで利用できるので、ぜひお試してください。
デモページ（h1,h2,h3,h4,h5,h6のデザイン例) 


<style type="text/css">
@CHARSET "utf-8";
:root {
	--base-color: white;
…

続く...

 さくらサーバーでWordPressをhttps化での無限ループの解消

  • 2017/04/14

さくらレンタルサーバでWordpressのhttps実装したら、無限ループになってしまった。
ここでは「さくらサーバーでWordPressをhttps化での無限ループの解消」対策を紹介します。

１、管理画面で、【設定】→【一般】を開き、
　　WordPress アドレス (URL)とサイトアドレス (URL)をhttpsに変更。

 CSSのみでのパンくずリストデザイン

  • 2017/04/10

好きなCSSのみでのパンくずリストデザインです。
お気に入りへ。
DEMO
ＤＥＭＯ 


<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>パンくずリスト</title>
<style>
.CrumbList { 
	list-style: none; 
	overflow: hidden; 
	border: 1px solid silver;
	box-sizing:
…

続く...

 さくらレンタルサーバのHTTPS統一の問題

  • 2017/03/30

最近は、サイトにSSL証明書入れ、httpをhttpsに統一表示しました。
統一方法は他人ブログに既に沢山掲載していますが、残念ながら大部の方法はさくらインタネットレンタルサーバに適用できませんでした。 


#動けない例：
   RewriteCond %{HTTPS} off
   RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
上記を.htaccessに入れたら、無現ループや500エラーなどの発生が多くあります。 


#正常例：
   RewriteCond %{HTTPS} off
   RewriteCond %{HTTP:X-SAKURA-FORWARDED-FOR} ^$
…

続く...

 出欠席スケジュール調整サービスをついに公開

  • 2017/03/29

ほぼ1カ月の休憩時間をかけて、スケジュール調整の「出欠席調整」オンラインサービスを開発し、今日までやっと完了しました。
未だ完璧なサービスではないけど、スケジュール調整の基本機能を揃いましたので、ほかのサイトで提供しているスケジュール調整サービスに負けないと思います。
それでは、スケジュール調整の「出欠席調整」オンラインサービスを詳しく紹介させていただきます。

１、出欠席スケジュール調整イベントの新規作成
　以下の項目が記入できます。…

続く...

 CakePhpでのフラッシュメッセージ表示問題２

  • 2017/03/23

前の文章で「CakePhpでのフラッシュメッセージ表示問題」の解決方法を掲載しました。
簡単に言うと、Cakephp2.7以後に非推奨となり、CakePHP3.0から削除する予定のFlash表示方法の 


×$this->Session->SetFlash(‘メッセージ’)　
→　
○$this->Flash->set(’メッセージ’)
で問題解決のキモです。

なお、上記の通りにソースコードを書き換えたら、下記のようなコメントコードを出るかもしれない。
対策はflash.ctpやsuccess.ctpなどのファイルで、シグネチャメッセージを削除する。…

続く...

 CakePhpでのフラッシュメッセージ表示問題

  • 2017/03/23

最近Cakephpを少しい触っています。ところで完了画面やワーニング・エラー画面でメッセージを表示でflashを利用したら、下記のようなエラーが画面で出ています。 


Notice (1024): Element Not Found: Elements/default.ctp [CORE/Cake/View/View.php, line 425]
コントローラ中で、$this->Session->setFlash(‘エラーメッセージ’,…)のように、ちゃんと正しく設定している。
更に調べたら、CakePHPのドキュメントにこう書かれています。 
バージョン 2.7.0 で撤廃: フラッシュメッセージの作成には フラッシュ を使用すべきです。 setFlash() メソッドは、3.0.0 で削除されます。
…

続く...

 MySQLでテーブルの外部キー更新

  • 2017/03/07

外部キーを持つテーブルの外部キーを更新したら、下記のような更新エラーが発生、更新できなくなります。
#1451 - Cannot delete or update a parent row: a foreign key constraint fails …
この場合、更新する際に外部キーチェックをしない指示を明示したら、更新できます。
下記コードを参考ください。 


ＳET FOREIGN_KEY_CHECKS=0;
Ｕpdate you_table set fk='test' where fk='oldvalue';
ＳET FOREIGN_KEY_CHECKS=1;

続く...

 ページコンテンツが少ない時にもフーターをページの最下部に表示

  • 2017/01/12

ページのコンテンツが少ない時に、画面フータ（footer）が上に上げってしまい事象が見たことがありますね。
画面のフーターなのに、ページの中央部頃に上がったら、ページのバランスがもちろん悪くなりますし、
お客様から御サイトへのイメージも良くないと思います。

本記事では、ページのコンテンツが少ないときにも、CSSでfooterをモニターの下部に表示させるサンプルコードを掲載します。
一言でいえば、ページメインコンテンツの高さを調整し、footerを下部に表示させる。
ここで、コンテンツの高さ = ページの高さ - headerの高さ - footerの高さ

DEMO 


<style
…

続く...

 画面遷移せずに確認ページ表示できるお問合せフォーム

  • 2016/12/06

会社Pマーク取得の際に、お問合せページがHTTPS及びお問合せ確認画面が設けるのが必要と指摘された。
確かに現在のお問合せ画面では入力画面入力したら、確認画面がなくて直接完了ページに遷移する流れになっている。
それは当時にコスト・開発時間削減の目的で確認画面を開発してなかった。
なお、どうしてもPマークを取得しなきゃいけないので、確認画面の開発作業が依頼された。

では、ここではページリロード無しで確認ページ表示できる方法を紹介させていただく。
（所謂ページ遷移せず、お問合せ入力フォームと確認ページが同じページに表示する）

JS・Jqueryの経験を持っていれば、１時間程度で理解できると思います。
分からなくても、コピペーで使えるものなので、実用にも問題がありません。
point：
①入力フォーム

<div
…

続く...

 マウスホイールでテーブルを左右及び上下スクロールさせる

  • 2016/09/21

本記事は「マウスホイールでテーブルを左右及び上下スクロールさせる」方法を掲載します。
動き：①左右上下スクロールバー移動したら、ヘッダー又はタイトルが固定し、横・縦部分は連動でスクロールする。
　　　②左メニュー・タイトル範囲内に、マウスホイール上下スクロールしたら、ヘッダー固定し、テーブルを上下スクロールする。
　　　③詳細データ範囲内に、マウス上下スクロールしたら、左タイトル固定し、テーブル左右スクロールする。

【DEMO】マウスホイールでテーブルを左右及び上下スクロールさせる
【ソース】 


<html>
<head>
<meta
…

続く...

 QRコード作成ツール

  • 2016/09/01

買い物にて買いたいものがたまに買い忘れることが多いです。
ある日突然このアイディアを考え出しました、QRコードにメモ内容を格納して、スマホからQRコードを読み込んで、買い物する。
もちろん、紙に手書きしてら写真を撮れば、買い物の際に便利につかるですね。なお、写真なんて変われないものですし、写真での文字内容もコピーできない。

では、QRコード作成できるツールのURL：
便利ツール：QRコード作成
http://www.benri.jp/widgets/qrcode/qrcode.html

生成したQRコードをスマホに読めば、買い物の際にメモ帳で利用できますね。

続く...

 HTML5のWeb Storage利用サンプル

  • 2016/08/19

HTML5から新規追加した機能であるweb storageの利用場面がありました。ここで一番基本なサンプルを載せます。

例：テキストに入力した値をweb storageに保存。そして保存した値を取り出しサンプル。 


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(function(){
	/* 入力値をweb storageでローカルに保存 */
…

続く...

 IEで「127.0.0.1は応答していません」エラーの解決方法

  • 2016/08/15

IEで「127.0.0.1は応答していません」エラーが発生する場合、「互換モード」が設定してないが原因です。
互換モードを設定したら、改善できます。
手順：

　IEブラウザで閲覧サイトをアクセスする。
　→ブラウザ「ツール(T)」を開き、「互換表示設定(B)」をクリック
→追加するWebサイト(D)：に閲覧している画面のIPを入れて「追加」
※「イントラネットサイトを互換表示で表示する(I)」　がデフォルトでチェックされている。
　　※「Microsoft互換性リストの使用(U) がデフォルトでチェックされている。

以上、メモを。

続く...

前へ       1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19   次へ