コーディング 2023年10月21日 多言語サイトが増えたら。自動翻訳機能を使って翻訳の手間を削減 弊社では2023年現在、制作しているサイトの7割以上が多言語サイトへの対応となっています。 多言語サイトとは、それぞれの異なる言語のページをあらかじめ準備したサイトのこと。 自動翻訳とは少し違って、あらかじめ人の手を介し …
コーディング 2022年3月24日 [Shopify]自作テンプレート開発者向けの基礎知識 アルテガメンバーの尾崎です。 Shopifyのテーマは、LiquidというShopifyがオープンソースで開発しているテンプレート言語で構築されています。 そのため、独自のルールを持っており、色々な文法やオブジェクトが存 …
コーディング 2022年2月16日 [Shopify]独自ドメインの設定方法 アルテガメンバーの尾崎です。 去年の暮れより、Shopifyを活用したお仕事に関わらせていただいており、オリジナルテーマ公開までの手順や、作業の中で躓いた点などまとめておこうと思います。 制作したサイトはこちら。 クライ …
コーディング 2022年2月16日 [Shopify]ローカルに開発環境を構築する(mac OS版) アルテガメンバーの尾崎です。 去年の暮れより、Shopifyを活用したお仕事に関わらせていただいており、オリジナルテーマ公開までの手順や、作業の中で躓いた点などまとめておこうと思います。制作したサイトはこちら。 目次 は …
コーディング 2021年9月29日 WebPで画像圧縮!便利なジェネレーターまとめ WebPのジェネレーターをまとめました。 モダンな開発では一般的になりつつあるWebP。 WebPは新しい画像の保存形式です。 JPEG 画像のよりも三分の二以下になり、圧縮だけでは限界を感じていた、ファイル容量問題に終 …
コーディング 2021年1月17日 2020年のCodepen で今すぐ使えそうなインタラクションがまとめられてた 去年のまとめ記事を集めてくれてるのってとてもありがたいですよね。 PHOTOSHOP VIPで取り上げられてたCodePenのソースコードでとても使えそうなものをここに備忘録として置いておこうと思います。 今すぐ使いたい …
コーディング 2020年6月25日 NoCodeツール色々調べてみた【NoCodeまとめ】 webデザイナーの平尾です。 最近NoCodeがクリエイター界隈を賑わせています。 NoCodeとはプログラミングの知識がなくても、ブラウザからの操作だけでプロダクトが作れると言ったものです。 でも、実際にweb制作会社 …
コーディング 2020年5月13日 【webflow入門】ノーコードを初めて使ってみた webデザイナーの平尾です。最近新しいツールにできるだけたくさん触れています。 少し前にShopifyの感想を書いていましたが、今回はwebflowを初めて使ってみた感想をまとめます。 webflowはコードを書かなくて …
コーディング 2019年11月5日 水面の波紋を実装するためのjqueryプラグイン【jQuery Ripples】 webデザイナーの平尾誠です。 水面のように水が揺れているようにするJquery のプラグイン、【jQuery Ripples】を紹介します。 これ系のwebGLは開くだけでPCからプシューって音がなる。 とかく、新しい …
コーディング 2019年5月4日 jqueryでメガドロップダウンメニューを作ろう メガドロップダウンメニューを今度コーポレートサイトで使う予定です。 だから今のうちに作っておこう。 コピペして使えるようにしたので、こちらをお使いください。 目次 jqueryでメガドロップダウンメニューを作ろう使ったj …
コーディング 2019年4月27日 vue.jsの学習で役立った記事にありがとうを言いたい webデザイナーの平尾誠です。 最近はvue.jsを学習しています。 そこでVue.jsを始めるために役立った記事を、これから始める人のために備忘録としてまとめておきたいと思います。 何から学習していいかわからない イン …
コーディング 2019年4月10日 WordPress超初心者が最初に知っておきたい基礎知識 今では世界のホームページの31%がWordpressを利用して作られています。 この記事は以下の方が対象です。 あなたに読んでほしい ホームページを自分で作りたい ブログをはじめたい WordPressって聞いたことある …
コーディング 2019年3月5日 PHPがわからなくてもオッケー。HTMLをPHPにして共通パーツを外部読み込みする。 Webデザイナーの平尾誠です。 例えばヘッダーとかフッターは全ページ共通のパーツだったりしませんか? たくさんのページで使われる同じソースコードは、コンポーネント化してインクルードしましょう。 PHPを使いますが、理解し …
コーディング 2019年1月27日 SCSSの使い方を初心者用にまとめた Webデザイナーの平尾誠です。 現在CSSを書いている人は、SCSS に記法を変えるだけでCSSの記述が極端に減りますよ。 SCSS は一言で言うと、CSSの記法です。 よく使うSCSS の記法は限られています。 調べれ …
コーディング 2019年1月23日 Web系プログラミングを独学で継続したければ脱線しよう Webデザイナーの平尾誠です。 表題の通りweb系プログラミングの歩き方をまとめています。 この記事は筋肉質な勉強法を否定するものです。 あらかじめご了承ください。 僕はもともとオリジナルの家具を作る家具の施工会社にいま …
コーディング 2019年1月19日 Web系エンジニアのスキルチェックシートを作ったよ Webデザイナーの平尾誠です。 最近アップデートしたポートフォリオが評判が良くて驚いています。 本当にありがとうございます。 さて、僕は最近MENTAというサービスを使い、Webサイト制作初学者へ向けたメンターをしていま …
コーディング 2018年12月8日 WordPressの投稿作成画面を昔のエディタに戻す Webデザイナーの平尾誠です。 Wordpress5.0にアップデートしたら、想像以上に使いにくい。 30分くらい使っていれば慣れるだろうと思っていました。 でも理解した上で、やっぱり使いにくいので戻しました。 快適。 …
コーディング 2018年12月5日 魅力的なCSS/javascript のテキストアニメーションまとめ Webデザイナーの平尾誠です。 今日は汎用的なテキストアニメーションを集めました。 テキストの現れ方が魅力的だと印象はグッとよくなります。 また、引きつけたいものに目線を導くことも可能です。 ほとんどのものはJquery …
コーディング 2018年12月4日 マウスカーソルを利用したマウスストーカー好例まとめ Webデザイナーの平尾誠です。 PC表示の際に、マウスポインターを利用してユーザーの体験を新しくするサイトが増えています。 ユーザーの体験をよりリッチに表現してくれます。 こんな感じですね。 自分もポートフォリオで実装し …
コーディング 2018年9月6日 お手軽なスマホでジャイロを用いたparallax.js これ以上ないんじゃないかってくらい簡単で便利なJsのプラグインを発見! スマホで見たら傾けたときに、ふわふわっと傾きます。 これは携帯に内蔵されているジャイロセンサーを使用したものです。 PCで見たときはカーソルに追従す …
コーディング 2018年6月3日 【jquery】ユーザビリティをよくするサンプルコードまとめ 制作現場では決まって時間がない。 だから決まって使うソースコードは使いまわしたいですよね。 コピペで使える便利なコードを、役割別にまとめました。 今後もどんどん追加していくので、ブックマークとしておくと困った時に役に立つ …
コーディング 2018年5月19日 カスタム投稿タイプの作成と投稿ページ・一覧ページの作り方 プラグインを使わずにWordpressのカスタム投稿タイプを作ります。 目次 カスタム投稿タイプの作成方法管理画面に項目追加投稿ページの作り方一覧ページの作り方カスタム投稿タイプの作成方法 ますはfunctions.ph …
コーディング 2018年3月30日 特定の時間で表示を変更する時限式javascript 今年のエイプリルフールは休日です。 休みの日に出社しなくてもいいように、特定の時間が来たら表示して、終わったら消す。 そんなソースコードを紹介します。 時限式で実装できるのでとてもおすすめです。 <section …
コーディング 2018年3月11日 写真をインスタ風にするCSSフィルターセット”Instagram.cssとfilter.css” 下手にPhotoshopで加工するよりinstagramの方がいけてる時あるよね正直。 デフォルトであるフィルタセットを使った方が、風合いが出ていいなって。統一感出すの簡単やし。 そんな時のCSSフィルターセットのIns …
コーディング 2018年3月9日 新着記事に”新着記事”ラベルを表示する【WordPress】 今日はいつもWordpressを作った後に追加で言われるやつ。 新着記事のみ”NEW”をとかラベルをつけてってやつです。 表示する日数も任意で変更が可能です。もちろんテキストだけではなく画像での表示も可能です。 これから …
コーディング 2018年2月22日 テキストにインパクトを与えるBlotter.jsをこれから多用しそうな予感 テキストにとてもインパクトを与えることができるJavascriptを発見しました。 その名もBlotter.jsです。 読み込んでテキスト打ち替えておしまい。超簡単。 Blotter.jsをダウンロード 公式サイトはこち …
コーディング 2018年1月6日 Javascriptの慣性スクロールはSCROLL MANAGERを使う とっても便利なススクロール系Jsを発見しました。 しかもMITライセンスときたら、使わせてもらうしかない。 では手を合わせて。いただきます。 目次 SCROLL MANAGERSCROLL MANAGERをダウンロード謝 …
コーディング 2017年12月29日 画像スライダーを作るのにSwiper.js以外のプラグインはもう要らない かなり強気なタイトルですが実際に最近の案件でSwiperというjavascriptのプラグインを使っております。 もう現場ではSwiper.js以外のJsは必要ないと思います。 目次 Swiper.jsの特徴他の優秀なス …
コーディング 2017年12月23日 固定ページに投稿記事一覧を表示する【WordPressテンプレートタグ】 表題の通り、固定ページに投稿の一覧を取得するテンプレートタグは、 使用頻度が高いのに思い出せないので僕のための備忘録です。 目次 テンプレートタグ:固定ページに投稿記事一覧を表示する記事数をコントロールする特定の記事だけ …
コーディング 2017年11月4日 wow.jsでスクロールをトリガーにしてアニメーションさせる wow.jsを使うととても簡単にスクロールアクションを設定できます。 スクロールを着火させるためにwow.jsでトリガーを設定→animate.cssを使ってアニメーションを設定。 この方程式は2年くらい使い続けています …