kojiokanoのブログ

コーディング業務で困ったところをまとめています。

github管理しているデータを修正しwordpressに反映させる方法(旧cp)

ターミナルで作業するディレクトリに移動し、masterに移動。 masterで直接編集作業をする。 ----------------------------------------------------------------------- テキスト編集作業方法 ↓のコマンドをうちドッカーを走らす docker-compose up ブラウザ…

rails sが走らない時の対処法

↓のようなエラーが出ている場合 port 3000 (Errno::EADDRINUSE) これは前回の作業でrailsが走っている状態でターミナルを終了し、表示はされていないが裏でport3000でrailsが接続されている状態になっている。エラーは既にport 3000でrailsが接続されている…

mdlアイコンの使い方例

hamlのhead内で↓を読み込む = stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/material-design-lite/1.2.1/material.min.css", 'data-turbolinks-track' => true = stylesheet_link_tag "//fonts.googleapis.com/icon?family=Material+Icons", 'dat…

mdlボタン使い方例(haml)

%button.mdl-button.mdl-js-button.mdl-button--raised MDLボタンテスト

他部署のエンジニアさんへの依頼方法

・「目的」「こうしたい」「現状」を伝えることが重要 ・ 細かなコードの指定などは任せた方が良い(この指定のコードをhoge.indexの10行目に挿入してください的な頼み方はよくない。) 以下依頼参考例↓ --------------------------------------------------…

間違ってローカルのmasterで作業してaddしてcommitしちゃった時の対処法

1.masterの名前を変更する git branch -m hoge 2.masterブランチがローカルに無いことを確認 git branch 3.masterブランチを復活させる git checkout master 4.作業があるブランチhogeに移動し、作業を確認しpushする git ch hoge git push origin hoge ----…

urlのパラメータを取得し、value(フォームテキスト)に設定する方法

URLのパラメータを取得してLPのテキストフォームへ吐き出す。 ※db_001で使用。db_001の場合はフォームをdisplay:noneで見えないようにしてる。 ——————————————————————————————————————— js部分 window.onload = function onLoad() { param = GetQueryString…

jQueryValidationEngineで、フォーカス外した時にバリデーション処理をさせない方法(submitボタンを押した時だけエラーが出るようにする)

1. ヘッダー内でcdnで読み込んでいるjquery.validationEngine.jsをローカルに落として該当LPのjsフォルダに入れる。 2. ヘッダー内のjquery.validationEngine.jsの読み込み先をcdnから先ほど落としたファイルに変更。 3. jquery.validationEngine.jsを編集す…

本番,stg,devの管理画面のフォームデータをlocalに適応させる方法

メガネさんにフォームのデータをもらう以下サンプル ---------------------------------------------------------------------------------- kja_domain = Domain.find_or_create_by(name: "kaigojob-agent.com", name_stg: "kja-elb-stg-10743901.ap-northe…

LP_BEM命名規則

使用例 Block__Elements--Modifire __Elements はアンダーバーを2つ使用--Modifire はハイフンを2つ使用 例 list__item--big Modifireなどで一言で命名できなければ(-)一つで繋げてあげる key-value 例 list__item--text-center クラスの付け方 主に迷うと…

thanksページの共通化(LP)

ステップの一番最後のページ(今までのthanksページにあたるページ)で以下のようにページ読み込みをする ----------------------------------------------------------------------------------------------- = render "inquiry_forms/templates/thanks/tha…

MDLのgridを使ったレスポンシブサイト作成法(sass,hamlの場合)

MDLグリッドとは MDLのグリッドを使うとレスポンシブサイトが簡単に作れるMDLグリッドの構造 ブラウザの画面を横のサイズによって3つのグリットパターンで表示する。 pc=12col ◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎ tab=8col ◼︎◼︎◼︎◼︎◼︎◼︎◼︎◼︎ sp=4col ◼︎◼︎◼︎◼︎ 各col…

URLの値を引き継ぐ(複数LP間での遷移)

異なるプレフィックスのLP間でのURLのパラメータ引き継ぎ方法 LP164やLP859などのように一つのLPの中にもう一つのLPへの遷移が含まれる場合、URLのパラメータが引き継がれず流入元が不明になってしまう。 そこで異なるLP間での URLのパラメータ引き継ぎをjs…

branchの削除(リモート、ローカル)

branchはこまめに削除しましょう。 ----------------------------------------------------------------------------------------- ローカルbranchの削除方法 1.下のコマンドを打ちローカルブランチのリストを表示 git branch 2.下のコマンドを打ちブランチ…

hamlページのAMP化

AMPとは 簡単に言うと、モバイル端末でのウェブページの表示を高速化するためのフレームワークでAMPのフォーマットでモバイルサイトを構成すると、リンク先のページを高速に表示することが可能になる仕様。AMP対応のページはスマホのgoogle検索で上位に表示…

hamlで作成したフォームのplaceholder内で改行したい時の対処法

lp_861のテキストエリアで使った方法 ↓使用例 -------------------------------------------------------------------------------------- haml = f.fields_for :answers do |a| -if a.object.body.nil? = a.hidden_field :form_part_id, value: @parts[1].i…

LPのトップページをnoindex、followにする

LPの最初ページをnoindex、followにすることがあります。 そうすることでindex(検索結果での表示)を拒否しながらリンクをたどることをrobotに許可することができます。 やり方はLPの最初のページのhead内に↓の書き込みをしてあげればOK %meta{:content => "n…

テキストの組み合わせでデザインする際のポイント

文字を画像にせず、なるべくテキストで表示させたい(seo的な観点から)ということがあるかと思います。 例えば ↓のようなデザインであれば ↓のようにほとんどデザインを崩さずテキスト化が可能です(ブラウザによって見え方は多少かわります) この例のよう…

LPのBEMルール

BEMルールを共通化して誰が見ても理解できて編集しやすいLPをつくることが目標 使用例 Block__Elements--Modifire __Elements はアンダーバーを2つ使用--Modifire はハイフンを2つ使用 例 list__item--big ↑なぜこのような書き方かと言うとLPのフレームワ…

iphoneのsafariでボタンの表示がおかしくなる場合の理由と対処法

LPなどのページを作っているとき、PCのブラウザでの互換表示ではちゃんと表示できていたのに、サーバーに上げて実機でみたら表示が違ったなんてことがよくあるとおもいます。 その原因の1つとしてiphone(ios)のsafariはinput要素にグラデーションを勝手に…

LPへのPDF貼り付け方

無料でガイドを見る系のLPでpdfファイルを見せたい場合があるかと思います。 LPページではpdfは他の画像ファイルとは異なる扱いになっているためフォルダの場所なども特殊です。 以下がpdfの貼り付け方になります。 ーーーーーーーーーーーーーーーーーーー…

スマホでフォームをタップした時にテンキーが表示されるようにする

LPで電話番号などの数字を入力する項目はよくあると思います。スマホユーザーが項目をタップすると通常はテキストのキーボードが立ち上がりますが、最初からテンキーを表示してやることでページからの離脱を減らすことができるかと思います。 方法は以下これ…

LPのフォーム作成方法2

任意の項目を作る場合の注意点 必須ではない項目を複数作る場合↓のようなコードで書くと遷移先のページの項目が重複して表示されることがある。 ●1つのフォームが複数表示されるのを直す。2行目のbodyをform_part_idに変更する = f.fields_for :answers do …

ステップ分けのあるLPの遷移方法

例.3ステップ後に完了ページへと遷移する場合 ------------------------------------------------------- ●ページ構成 1ページ目・・・_form.html.haml 2ページ目・・・_form_1.html.haml 3ページ目・・・_form_2.html.haml 完了ページ・・・_thanks.html.h…

LPのフォーム作成方法

●専用項目があるものに関しては1行書けば良い↓(専用なのでvalueで番号を設定する必要がない。カイポチシステムでフォームに部品を追加する必要もない。) 例.氏名入力テキストフォーム = f.text_field :name, class: 'w100 validate[required]',placeholder…

biz_LPページの環境設定

1. ローカルにgit cloneしてローカル環境を作る。 ターミナルでrbenvを使ってruby 2.3.0をインストールする。 $ rbenv local 2.3.0 を打ってローカルのrubyを2.3.0に設定する。 同じくターミナルでrails 4.2.6をインストール。 ※なん度やっても上手くいかな…

コンフリクト解消手順(簡単10ステップ)

pushしてgithub上で確認したらコンフリクトしてた!そんなときの対処法。 1 git checkout master でマスターブランチに移動 2 git pull もしくは git fetch + git merge origin/master を打ってmasterを最新状態にする 3 git checkout 作業ブランチ名 を…

git stashについて

間違ったブランチやマスターで作業をしてしまって作業内容をstashして正しいブランチに移動することは良くあることと思います。 カット&ペースト感覚で使っているかと思うのですが、stashされた内容は次にstashしたときに上書きされるわけではなく、別のsta…

リベースに失敗したときのコマンドいろいろ

うまくリベースできないときに使うコマンド リベースで衝突が起きたりすると、リベース作業が一旦中止されます。このとき、下記のコマンドが使えるようになります。 git rebase --continue:衝突などを解決したあとに実行してリベースを続行する git rebase …

addの取り消し

addしたくないファイルを間違えて $ git add . や $ git add ファイル名 で addしちゃった時、addを取り消しをしたいですよね。 そんな時は以下のコマンドでaddしたファイルを1つづつadd取り消ししましょう。 git rm --cached ファイル名 レッツaddトリケ…

コンフリクトの解消法

1.branchをgit pushしたので、githubのサイトで確認したところコンフリクトを起こしていた。 2.ターミナルでマスターにチェックアウトする。 3.マスター上でgit pullする。 4.pushした作業branchにもどる。 5.git rebase masterコマンドを打つ。 …

git addしてしまったファイルでコミットしたく無いものがあったときの対処法

変更するつもりじゃなかったファイルをうっかり変更してしまって、なおかつgit addまでしてしまったときの対処法です。 まず下のコマンドで変更したくないファイルのaddを取り消します。 $ git reset HEAD ファイル名 変更したくないファイルのaddが取り消せ…

gitで大量の削除ファイルを一括でgit rmする方法

以下のコマンドを打つ。 % git rm `git ls-files --deleted`

ブランチの名前をかえる(push前)

ブランチをきって作業をはじめたところ思わぬ修正箇所が見つかり、作業内容が変わってしまうことは間々あります。 そんな時、push前であればブランチ名を変更することが可能です。 以下方法↓ ーーーーーーーーーーーーーーーーーーーーーーー 名前を変更した…

git ローカルブランチの削除方法

作業の終わったブランチがローカルに残って溜まると作業の邪魔になる。 もう使わないブランチは削除する。 削除コマンドは以下。 git branch -d 削除したいブランチ名 ↑のコマンドがきかないときは-dを-Dに変えてやる↓ git branch -D 削除したいブランチ名 …

gitでのファイル削除方法

atom ツリーから削除したいファイルを選び、右クリックし「delete」を選択し削除する。 テラターム ”git status ”を打ちファイルの場所を確認。 ”git rm ファイルの場所と名前 ”を打ちファイルを削除する。 ”git add ファイルの場所と名前 ”を打ち削除したフ…

svg画像へのリンクの付け方

svg画像をaタグで囲んでもリンクがはれない。 その場合はsvg画像をテキストエディタで開いて画像ファイルに直接リンクを書き込んでやる必要がある。 詳しくは↓をみるとわかる。 SVG画像にリンクを貼るには | wtpmj.com ※svg画像内に透明背景などがある場合そ…

$ git statusを叩いて赤い文字でフォルダやファイルが表示された場合の対処法

addしたいものは↓を打って緑文字で表示されるようにする。 $ git add ルートファイル名 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーー addしたくないものは↓を打ってmasterの状態の上書きをするか $ git checkout ルートファイル名 もしくはu…

間違った変更ファイルをaddしたときの対処法

terra tameで複数ブランチを切っている状態で 誤って、 $ git add -a をして異なるブランチの変更ファイルを一緒にaddしてしまった。 ----------------------------------------------------------------------------------------------------- こんな時の対…

atomをmiddlemanで使った後、terra tarmに繋げる方法

atomを立ち上げる。 ↓ ツリーの一番上のフォルダを右クリックし「プロジェクトフォルダを除去」をする。 ↓ 次に「フォルダ」→「プロジェクトフォルダを追加」→デスクトップのkjgitを指定。 ↓ 「パッケージ」→「Remoate-FTP」→「Connect」 これでできるはず。

cssの変更をキャッシュの残っているユーザーに読み込ませる方法

ページのキャッシュが残っているユーザーがcssに変更のあったページに再訪した際に 強制的にcssを読ませたい。(cssの名前は変えずに) そこで↓こうしてみる。 例 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 編集前 <link rel="stylesheet" type="text/css" href="/css/search/style.css"> 編集後 <link rel="stylesheet" type="text/css" href="/css/search/style.css?v=20160404"></link></link>…

コーディング関連

コーディングで躓いたところなどの備忘録としてブログで残します。