設定方法LoadingBrunoProfileWork制作の方針についてBrunoが生み出すWebサイトは、文章や写真を活かすためのデザインをご提供します。訪問者へアピールするためのコンテンツがメイン。この意識のもと、適切な見せ方を追求しながら制作しております。基本WordPressサイトの制作となりますが、ご希望に合わせてHTMLの静的サイトの制作ももちろんお請けさせていただきます。デザインだけやコーディングだけといった制作工程単位でのご依頼も対応しております。ある質問BrunoのWebサイト制作では、できるだけクライアント様にご不安を与えることなく、お問い合わせ時から制作完了時、その後の運用までサポートさせていただいておりますが、その際によく頂くご質問についてご紹介致します。制作実績これまでに制作させていただいてきたWebサイトの実績をご紹介致します。当制作の一番のウリはクライアント様ご自身での更新ですので、制作時と現在のデザインが異なる場合もございます。リンク先は参考程度にご覧ください。画像をポップアップ表示させるjQueryプラグイン『lity』の設定方法をご紹介します。この『lity』は、画像だけではなくYouTube動画やGoogleマップ、リンク先のページもポップアップ表示できるという高機能プラグインでもあったりします。利用頻度の高いものなので、ぜひお試しください。lityプラグインの準備Lityのサイトからファイルをダウンロードして、任意の場所にアップロードします。Lityそして、アップロードしたファイルを読み込みます。src="/lity.js"></script>Lityファイルをアップロードするのが手間であれば、以下のタグを記述するだけでも使用できます。src='https://cdnjs.cloudflare.com/ajax/libs/lity/1.6.6/lity.js'></script>これで準備は完了です。Lityでポップアップ表示させる先述した準備が完了すれば、実際に表示させるだけです。画像をポップアップ表示ポップアップさせたい画像を用意して、以下のタグを記述します。src="画像URL"/></a>サンプルYouTube動画をポップアップ表示YouTube動画もポップアップ表示させることができます。自作の地図画像を用意して、画像をクリックするとGoogleマップがポップアップ表示されるという表示もおもしろいですね。data-lity="data-lity">地図画像</a>サンプル地図画像リンク先ページをポップアップ表示Lityで一番おもしろいなと思ったのが、リンク先のページをポップアップ画面で表示ができること。ブログ紹介やサンプルを紹介する際に、わざわざリンク先を見にいってもらう必要がなく、記事内で表示させることができるので、訪問者としても便利な機能ですよね。これは一部制限があるようです。スマホでも表示がうまくいかず使用機会は限定されますのでご注意ください。data-lity="data-lity">リンク先の紹介</a>サンプル※PCでご覧ください。ブログ記事でもっとポップアップ表示を活用してもいいと思う画像で説明する際に、記事コンテンツの表示領域が狭いブログは、ポップアップ表示に対応して欲しいな(広告以外)と思う機会が多いです。このサイズだとちょっと見づらいなって。動画の紹介でも新たにウィンドウを表示させてまではという時もありますよね。いった時は、Lityでポップアップ表示させてあげると便利に閲覧することができます。jsだけ読み込んでおけば簡単に設定できるので、ぜひ使用してみてください。このブログでも機会があったら使っていこうかな。!この記事が気に入ったら、フォローしませんか!更新情報を配信します。マサユキフリーランスWebデザイナー。個人事業者向けにWordPressを活用したWebサイトを制作。サイト運用に関するノウハウなどもご提供してます。モバイルファーストインデックスへの事前対策2美容室デザインを制作される方のために、良質な美容室サイトデザインをまとめてクリップ3Web制作者が厳選したブックマークを晒してみる。moreflexbox[CSS3]で実践的なレイアウトを。moreWeb制作者が厳選したブックマークを晒してみる。Contactお問い合わせWebサイト制作に関するお問い合わせは以下のページからお願い致します。