1. 本システムの機能 ================================= 1). セミナー申し込みフォーム 2). 参加者リスト自動生成 3). 受講票兼自動返信メール作成・送信 4). 関係者宛 受付通知メール送信 5). リマインドメール送信 2. システムの流れ ===================…
カスタム投稿タイプ作成方法 WordPressのカスタム投稿タイプという機能を活用すると、 通常の投稿タイプとは区別して記事を作成・掲載していきたい場合に便利です。 、 カスタム投稿タイプの作成には、以下、「Custom Post Type UI」といった有名で非常に便…
＜目次＞ パスワード認証によるページ閲覧制限方法 1).基本認証による方法 2)、JavaScriptによる方法 パスワード認証によるページ閲覧制限方法 1) 基本認証による方法 2) JavaScriptによる方法 1).基本認証による方法 1).基本認証による方法は、4/7の内容を…
サイトに「.htaccess」ファイルを設置しました。 「.htaccess」とは Webサーバーに設置すると、設置したディレクトリ以下に対して制御することができます。 ※Webサーバーに「Apache」を使用していることが前提「.htaccess」ファイルでできること 主な用途と…
CSS 個別の記事にCSSを設定する カスタムフィールドを活用すると、作成中の記事に独自のスタイルを設定することができます。 WordPressの記事単体に独自のスタイルを設定したい場合、 エディタ内でCSSを書いてもスタイルを設定することはできますが、 これは…
CSS3によるアニメーションボタン No.2 拡大・縮小するアニメーションボタンを作成しました。 Demo css3 アニメーションボタン(拡大・縮小) | WebStock 以下、ソースを記載します。[ソース] html <a href="#"><img class="area-main-topbtnr" src="http://サイト/パス/画像ファイル名" width="100%"></a> ※上記、サイト名、パス、画像ファイル名は適宜変更してくださ…
グローバルナビのテキストをhoverで切り替える方法 グローバルナビにマウスを重ねた時、文字を変更する方法を確認、実装してみました。ここでは、下図のように、 ↓ 標準時英語表記のグローバルナビメニュー ↓ (マウスホバー) ↓ 日本語表記するという動作を実…
今日は、Sass編集時に役立つ、こちらのツールをご紹介させていただきます。 ダウンロード先： http://koala-app.com/ Sass (サス) とは Syntactically Awesome Stylesheets の略だそうです。 一言で言うと、拡張版CSSといったところでしょうか。 CSSが入れ子…
今日は、Bootstrapテンプレートでコーポレートサイト(デモサイト)を作成しました。 使用したのは以下のUNIONというFreeのテンプレートです。 で、作成したデモサイトがこちらです。↓ SAMPLE PRESSこういったテンプレートを利用すると、 シングルページのスタ…
カンバスサイズから画像を指定サイズに加工(縮小) Photoshopの「イメージ」-「カンバスサイズ」から、画像を指定サイズに変更(縮小)する方法です。 【手順】準備： ※この作業時、「選択したレイヤーのバウンディングボックスを表示」はチェックしておいてく…
ヒートマップを利用する 無料でも使えるサービス 自作しようと思う時に参考になる情報 はてなブログユーザーなら使いたいヒートマップツール「Ptengine」 WordPressでヒートマップを使おうと思う時に参考になる情報 ヒートマップを利用する 「ヒートマップ」…
更新日自動入力機能をGoogleスプレッドシートに追加 Googleスプレッドシートは、最近仕事でチーム利用することが多くなりました。今日は、スプレッドシートで管理している表中の値が更新された場合、その更新日を記録したいとのメンバー要望により、該当行に…
ECサイト設置用 CSS3のアニメーションバナー ECサイト設置用にCSS3のアニメーションバナー、 作りました。 ※以下はDemo用ダミーです。Demo 以下、サンプル用のソースを共有します。 <style> /* 基本設定 */ html, body { margin: 0; padding: 0; } body { font-fami…
今日は、新しく作ったサイトに Google Analytics を設置するなどの作業を行っておりました。 Google Analyticsとは 公式サイト： https://analytics.google.comGoogleが提供するアクセス解析ツールのことです。 サイトに導入(※)すると、サイト訪問者の動向・…
スマホサイトでおなじみ、ハンバーガーメニュー 今日は、CSSのみで実装可能、 開閉動作付きハンバーガーメニューを作成しました。 Demo 以下、このたびのソースを公開しておきます。 ソース公開 HTML <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> </meta></meta></head></html>
CSSで右向き三角ボタンを作る transparentを使って下のボタンを作ってみました ECサイトなどに使えそうなボタンです。 備忘録として、ソースを記載します。 [ソース] html <a href="#" class="see_detail">詳細を見る</a> [ソース] css a.see_detail { width: 160px; font-size: 16px; } .see_de…
2017年より、広告代理店勤務、Webデザイナーとして新たな一歩を踏み出しました。 職業訓練校でのWeb制作科卒業後から2年半、 その間はなかなかWebデザイナーとしての就業の機会が得られず、訓練校前と同様、システム開発の仕事に携わっていました。 （Web制…
Google日本語入力をインストールしました。 以下、手順を記載します。 1. 以下サイトより、プログラムファイルをダウンロードします。www.google.co.jp 2. 以下、ダウンロードしたプログラムファイルをダブルクリックし、インストーラを起動します。 GoogleJ…
Surface3を購入しました。 まずは、その感想です。 1) 感想 [ 良かったこと ] タブレットとPCの両方の性質を兼ね備えていること。 スペックがそんなに良くなくても、意外とWeb制作にも使えてます。 軽い！ 薄い！ キーボードはなかなか快適！ [ イマイチだっ…
PHPによるWordPressカスタマイズブック―3.x対応著者 : 藤本壱ソシム発売日 : 2010-09ブクログでレビューを見る»WordPressをカスタマイズするにあたり、 特に、カスタム投稿タイプ、カスタムフィールドの利用について参考にしたくてこの本を購入しました。購…
【本日のWeb制作 学習メモ】 ひとつ前の記事の関連となりますが、 phpMyAdmin で CSVインポートがうまく行かなかった原因の一つに、 元データとして受け取っていたExcelシートにセル内改行が含まれていたという問題がありました。 数百件に及ぶデータの中か…
【本日のWeb制作 学習メモ】 phpMyAdminを用いてCSVファイルでインポートする方法（覚書） CSVデータの読み込みに意外と手こずってしまったので、、、ということでの覚書です。 いろんなサイトを参考にさせていただきながら試行錯誤した何とか成功。 なお、…
DataTables とは、 HTMLテーブルをとっても高機能にしてくれる jQueryのプラグイン たとえば、以下のような機能がとっても簡単に実装できます。 テーブルヘッダにソート機能を付け、列ソートができます。 フィルター機能で、検索がとっても簡単にできます。 …
RSSフィードを簡単にサイトに表示するには Google Feed APIを使って、簡単にRSSフィードをサイトに表示する方法 Google Feed APIを使うと、簡単にRSSフィードをサイトに表示することができると知りました。 試しに、自身のブログサイトからfeed用URLを取得し…
【本日のWeb制作 学習メモ】 MACを使いこなす（ファンクション編） jQueryを使ったWebページ制作 mysql 文字化け対応 1. MACを使いこなす（ファンクション編） WindowsからMACを使うようになって困ったこと Windowsでは普通に使えていた入力変換ができない！…
【本日のWeb制作 学習メモ】 ショッピングサイトを作ってみる PHPの演習として、ショッピングサイトを作ってみます。 作成ページ（ページ遷移）は以下の通り 1.スタッフ追加画面 2.入力チェック画面 3.スタッフ追加完了画面 4.スタッフ一覧画面 5.スタッフ …
【本日のWeb制作 学習メモ】 [PHP] ロジックとデザインの分離 PHPをHTMLに組み込む際、ロジックとデザインを分離してコーディングするように配慮する。 理由： チームで分業の場合など、WEBデザイナーがPHPを理解できるとは限らない。 ソースのわかりやすさ…
2014年7月に制作科受講終了以後の活動について、その後の活動は、「まだまだ続くよ…」でと告知していましたが、 やっぱり引き続きこちらで続きを投稿します。引き続きよろしくお願いいたします。
改めまして 求職者支援訓練後も続く、My Web道…Web制作に関する学習メモを公開していきます。
修了日を迎えて… 6ヶ月に及ぶWeb制作科の授業が終了しました。毎日9時から14：25までの5コマの授業、 開始当初は結構長いと思われた6ヶ月は、始まってしまえば、あっという間の6ヶ月でした。 修了後、Web制作に関わるのか、全然違う職場に行くのかは、人それ…
