umeyuka

東京でwebデザイナーをしています

umeyuka

東京でwebデザイナーをしています

Contactform7を静的ページで表示

Contactform7を表示したい静的ページに記載（DOCTYPEより上に） <?php require("../wp/wp-load.php"); ?><!DOCTYPE html> ヘッダーとフッターに記載 //ヘッダー閉じタ…

umeyuka
umeyuka
3年前

WP固定ページのショートコード

WP固定ページのルールとして、固定ページのテキストエディターにphpコードを記述することはできない。 PHPをかくときは、 ①ページテンプレートを使う ②ショートコードを…

umeyuka
umeyuka
4年前
1

疑似要素のサイズ指定

/*--- 背景画像としてwidth・height指定可能 ---*/.ex:before { content: ''; display: inline-block; width: 40px; height: 40px; background-image: url(../img/ex.jpg);…

umeyuka
umeyuka
4年前

githubのイレギュラー備忘録

■起きたこと ・githubのパスワードを失念 ・二段階認証設定していた＋スマホ変更したため二度とログインできない ★2段階認証システム 機種変更時の再設定方法 ・新しいgi…

umeyuka
umeyuka
4年前
3

レスポンシブについて

レスポンシブデザインとは、見る人のデバイス（パソコン、 タブレット、モバイルなど）に関係なく、共通のURL・HTML・CSSで画面サイズに応じてレイアウトやデザインを変え…

umeyuka
umeyuka
4年前
1

counter-increment備忘録

ちょこちょこ使う連番CSS <!-- html --><div class="cake_wrap"> <div class="cake_wrap_item"> <h2>ショートケーキ</h2> <p>苺が乗った生クリームたっぷり…

umeyuka
umeyuka
4年前
1

javascriptで一括税込価格にしたいとき

今まで税抜き表記だった部分を、税込表記に変更したいときのcode備忘録！ <!-- html --><h1>ケーキ屋さん</h1><h2>好きなケーキを選んでね</h2><table class="c-wrapp"> …

umeyuka
umeyuka
4年前

npm

npmとは何か？ Node Package Managerの略でnpmという。 Node.jsのパッケージを管理するもの。 （Node.jsはサーバーサイドのJavaScript） npmコマンド //バージョン確認$ …

umeyuka
umeyuka
5年前
3

CX DIVE

4/17(水)「テクノロジーにより進化するコミュニケーションとCXの未来」 御登壇者 ユカイ工学株式会社　青木さん 株式会社Synamon　武樋さん ハフポスト　南さん ユカイ工…

umeyuka
umeyuka
5年前
1

Amazon Rekognition事前準備

1：Amazon Rekognitionとは 公式サイトはこちら。 1）高精度な顔分析および顔認識が可能。 2）イメージ分析用 「Amazon Rekognition Image」 と、ビデオ分析用 「Amazon Re…

umeyuka
umeyuka
5年前
1

SCSSとSASS

SCSSとSASSについてのアウトプットです。 1）Rubyをインストール（Macの場合は予め入っているので不要） RubyInstaller $ ruby -v //rubyのバージョン確認。出なければ…

umeyuka
umeyuka
5年前
5

Slack×GAS連携（"みやもとさん"シンプルVer)

こんにちは。 勤怠管理の方法の一つとして、SlackとGAS（スプレッドシート）を連携してみることになり、二日間苦戦していたのでnoteに残すことにしました。 本家：みやも…

umeyuka
umeyuka
5年前
2

gitについて

gitコマンドの記録。 リモートリポジトリの作成と、gitにユーザー名とメールアドレスは登録済みの状態以降のお話です。 1）.git ディレクトリの作成 作業しているディレク…

umeyuka
umeyuka
5年前
3

Netlify⇔github連携

Netlify⇔github連携についてのまとめ。 1：githubアカウントを作成する。（詳細は割愛） 2：githubリポジトリ新規作成 　1）Repository nameを付けてCreate。 3：ロー…

umeyuka
umeyuka
5年前
4

Vue.jsコンポーネント①

今日はコンポーネント（1）について。 1：コンポーネントとは？ html要素の一つのかたまり（例えばヘッダーなど）のこと。UIを部品化し、同じWebサイトの異なるページでも…

umeyuka
umeyuka
5年前
2

UXデザインについて②

1：ミラーの法則 人間が短期的に記憶できる情報量の限界が「7±2」であると、認知心理学者のジョージ・A・ミラー氏は発表した。これはかたまりの数を意味していて、7±2に…

umeyuka
umeyuka
5年前
2

Contactform7を静的ページで表示

Contactform7を表示したい静的ページに記載（DOCTYPEより上に） <?php require("../wp/wp-load.php"); ?><!DOCTYPE html> ヘッダーとフッターに記載 //ヘッダー閉じタグの上に<?php wp_head(); ?></head> <body>//ボディ閉じタグの上に<?php wp_footer(); ?></body> 問合せフォームを埋め込みたい場所にショートコード <div><?php echo

umeyuka

WP固定ページのショートコード

WP固定ページのルールとして、固定ページのテキストエディターにphpコードを記述することはできない。 PHPをかくときは、 ①ページテンプレートを使う ②ショートコードを使う どちらかになる。 今回は②のショートコードについて。 １.functions.php内に以下の記述 function my_php_Include($params = array()) {extract(shortcode_atts(array('file' => 'default'), $para

umeyuka

疑似要素のサイズ指定

/*--- 背景画像としてwidth・height指定可能 ---*/.ex:before { content: ''; display: inline-block; width: 40px; height: 40px; background-image: url(../img/ex.jpg); background-size: contain; vertical-align: middle;}/*--- width・height効かない ---*/.ex:before {

umeyuka

githubのイレギュラー備忘録

■起きたこと ・githubのパスワードを失念 ・二段階認証設定していた＋スマホ変更したため二度とログインできない ★2段階認証システム 機種変更時の再設定方法 ・新しいgithubアカウント作成 ↓ ・今まで使っていたgithub desktopをサインアウトし、新しいgithubアカウントでサインイン（サインインはできていること確認） ・git cloneしようとしても、「Please tell me who you are」の表示 　　★git config --glo

umeyuka

レスポンシブについて

レスポンシブデザインとは、見る人のデバイス（パソコン、 タブレット、モバイルなど）に関係なく、共通のURL・HTML・CSSで画面サイズに応じてレイアウトやデザインを変えることを言います。 ★共通のURL・HTML・CSSでかくため、管理が簡単 ★URLが統一されていることで、シェアしやすい ★Google検索アルゴリズムに対応できる PCとスマホでURLをわけて表示させるという方法もあるが、Googleは推奨していない。（現在モバイルユーザーがPCユーザーを上回っている

umeyuka

counter-increment備忘録

ちょこちょこ使う連番CSS <!-- html --><div class="cake_wrap"> <div class="cake_wrap_item"> <h2>ショートケーキ</h2> <p>苺が乗った生クリームたっぷりのケーキ</p> </div> <div class="cake_wrap_item"> <h2>モンブラン</h2> <p>栗のクリームが山の形のようになったケーキ</p> </div

umeyuka

javascriptで一括税込価格にしたいとき

今まで税抜き表記だった部分を、税込表記に変更したいときのcode備忘録！ <!-- html --><h1>ケーキ屋さん</h1><h2>好きなケーキを選んでね</h2><table class="c-wrapp"> <tr> <th>ショートケーキ</th> <td>500円</td> </tr> <tr> <th>モンブラン</th> <td>1000円</td> </tr> <tr> <

umeyuka

npm

npmとは何か？ Node Package Managerの略でnpmという。 Node.jsのパッケージを管理するもの。 （Node.jsはサーバーサイドのJavaScript） npmコマンド //バージョン確認$ npm -v$ npm --version$ npm version//対話形式でpackage.jsonを生成$ npm init//対話形式の答えを全部yesでpackage.jsonを生成$ npm init -yes//ローカルへインストール$ n

umeyuka

CX DIVE

4/17(水)「テクノロジーにより進化するコミュニケーションとCXの未来」 御登壇者 ユカイ工学株式会社　青木さん 株式会社Synamon　武樋さん ハフポスト　南さん ユカイ工学株式会社概要 - ユカイなロボティクスで世界をユカイにする。 - すべての家庭にロボットが当たり前にある世界 - 去年リリース「Qoobo」 3/30にファンミーティングを行った。 - Bocco（見守りロボット）お年寄りユーザー増えている。 株式会社Synamon概要 - VRを活用

umeyuka

Amazon Rekognition事前準備

1：Amazon Rekognitionとは 公式サイトはこちら。 1）高精度な顔分析および顔認識が可能。 2）イメージ分析用 「Amazon Rekognition Image」 と、ビデオ分析用 「Amazon Rekognition Video」の2つのAPIがある。 2：事前準備 Rekognitionを使うために、まずは事前準備が必要。 今回やりたいこと＝画像がアップロードされたら、その人物がS3バケット内に保存されている画像と一致するかどうか？を返して欲しい。（

umeyuka

SCSSとSASS

SCSSとSASSについてのアウトプットです。 1）Rubyをインストール（Macの場合は予め入っているので不要） RubyInstaller $ ruby -v //rubyのバージョン確認。出なければインストール必要 2）Sassのインストール（Mac版） SCSSを使う場合もこちらを行う。 ＄ sudo gem install sass　//インストール$ sass -v　//バージョン確認： 表示されればOK 3）Sassの監視（watch） フォルダを指

umeyuka

Slack×GAS連携（"みやもとさん"シンプルVer)

こんにちは。 勤怠管理の方法の一つとして、SlackとGAS（スプレッドシート）を連携してみることになり、二日間苦戦していたのでnoteに残すことにしました。 本家：みやもとさんは本当に便利！すごいなあと思います。 詳しい連携方法は本家githubを確認して頂くとして、シンプルにメモしていきます。 1）GoogleAppsScript作成 ・GoogleAppsScriptにて、githubのmain.js内コピペ。 ・GAS内のsetUp関数を実行し、「Slack Ti

umeyuka

gitについて

gitコマンドの記録。 リモートリポジトリの作成と、gitにユーザー名とメールアドレスは登録済みの状態以降のお話です。 1）.git ディレクトリの作成 作業しているディレクトリへ移動し、下記コマンドを入力。 $ git init 2）リポジトリへの登録 $ git add [オプション]$ git add hoge.html 　//hoge.htmlファイルのみを指定$ git add *.html //.htmlの全ファイルを指定$ git add . /

umeyuka

Netlify⇔github連携

Netlify⇔github連携についてのまとめ。 1：githubアカウントを作成する。（詳細は割愛） 2：githubリポジトリ新規作成 　1）Repository nameを付けてCreate。 3：ローカルからgithubリポジトリへpush 　1）ターミナルで「作成したディレクトリ（ファイル）」内へ移動し以下（二行目以降）を打つ。 MacBook: username$ cd hogehoge　//(移動したいディレクトリに移動する)MacBook: hoge

umeyuka

Vue.jsコンポーネント①

今日はコンポーネント（1）について。 1：コンポーネントとは？ html要素の一つのかたまり（例えばヘッダーなど）のこと。UIを部品化し、同じWebサイトの異なるページでも再利用可能にしたり、管理しやすくするためのツールの一つである。同じようなコードを何回も繰り返すと煩雑になってしまうため、シンプルにわかりやすくコンポーネント化しておくことで開発効率を高められる。 2：コンポーネントのメリット ・再利用性が高まり、開発効率を上げることができる。 ・既存コンポーネントを再利

umeyuka

UXデザインについて②

1：ミラーの法則 人間が短期的に記憶できる情報量の限界が「7±2」であると、認知心理学者のジョージ・A・ミラー氏は発表した。これはかたまりの数を意味していて、7±2にまとめると記憶しやすいという。 例）電話番号0123987456　　　　　　→　電話番号 0123-987-456レストラン名叙々苑ABCDE店　→　レストラン名 叙々苑 ABCDE店 ユーザーに記憶・認識してほしい情報項目内では、この法則に乗っ取ってわかりやすく表示するなどするとよい。 2：ヒックの法則

umeyuka