HP運営ブログ

2017年10月のブログアーカイブ

2017.10.30.会社案内を変更してみよう! その4

皆さん、こんにちは(・ω・)ノ

中村@新人です。

 

さてさて、今回は↓この部分。

メニューに残っているタイトルを変更していきます。

 

 

***  メニューの変更方法  ***

まずは右クリックの「メニュー」から「メニュー名編集」を選択します。

 

 

「メニュー名編集」を選択すると、そのまま編集画面に切り替わるので、

今回は「会社案内」から「運営会社」へタイトルを変更します。

 

 

 

左側のメニューの名前の変更はこれだけ♪簡単ですよね(*´ω`*)

 

 

しかし!まだアクセスマップがメニューにあるので、これを消す作業をします。

 

右クリックの「メニュー」から「メニューリスト」を選択。

(Groopメニューにも項目があるのでどちらからでもOKです)

 

 

出てきたメニューリストの「運営会社」の左にある「+」をクリックします。

 

 

すると、運営会社の下に「アクセスマップ」が表示されるので、

一番右にある「ゴミ箱のアイコン」を選択します。

 

 

確認画面で「OK」を選択
(´・∀・)っ

 

 

「メニューリスト」と「ページ上のメニュー」から「アクセスマップ」がなくなりました。

 


 

 

もし「アクセスマップ」を元に戻したい場合は、

「メニューリスト」の画面で運営会社の右側にある「++」をクリックして項目を追加します。

 

 

追加された編集欄に【タイトルを入力】して、【サイト内リンクを選択】して、【アクセスマップを選択】して、右側の保存ボタンをクリックで元通りのメニューになります。

 

 

 

今回はコンテンツとしてのページは残しつつ、メニューのみを編集するやり方を紹介しました。

 

ページの中に「会社案内」となっている部分があと少し残っているので、

次回の「Groopで作ってみよう」では、残りの部分の変更の仕方をお教えします♪

 

 

 

 

 

 ↓↓↓ Groopを試してみたくなった方はこちらからどうぞ ↓↓↓ 

 

 

 

2017.10.23.初心者さんのためのミニWEB語録 *** GPS ***

皆さん、こんにちは(・ω・)ノ

中村@新人です。

 

前回のブログ「会社案内を変更してみよう!その3」でマップの入れ方を紹介したところから、今回はマップ等に関連があって、よく聞くあの言葉を紹介します。

 

 

● GPS

GPSという言葉は耳に覚えのある方がほとんどだと思います。

 

携帯やスマートフォン、カーナビなど、身近な生活の中に取り入れられていて、欠かすことのできないものの一つになっていますね(*´ω`*)

 

例えば、初めて行く場所に向かう時等に自分の現在地を地図アプリで見たり、カーナビで住所を設定して案内をしてもらったり、バイクや自転車に付けて盗難にあった時に見つけられるようにしたり、子どもやお年寄りのスマホ等に設定して位置情報がわかるようにしたり…様々な場所で使われています。

お仕事などでは、バスやタクシー、トラック、船、飛行機等の運行情報の管理や、天気予報であったり、土壌調査等の色々な調査といったことに使用されています。

 

実は元々はアメリカが軍事用に飛行機や船などの航法支援用として開発したシステムでした( ゚Д゚)

 

GPSは、Global Positioning System(グローバル・ポジショニング・システム)の略称で、「全地球衛星測位システム」「全地球測位システム」「汎地球測位システム」とも呼ばれています。

 

人工衛星を利用した測位システムで、地球の上空にある約30個ほどのGPS衛星から発信されている情報を、GPS受信機が受け取って計算することで受信機の現在地がわかる仕組みとなっています。

 

 

かなり正確な位置情報が出るGPSですが、衛星の配置による誤差が出ることもあります(>ω<;)

衛星の数が増えれば、より正確な情報が出せるため、日本では日本版GPSの「準天頂衛星初号機みちびき」という衛星が開発されました。

衛星が交代で待機してGPSを補完するシステムで、これから徐々に衛星の数を増やしてより正確な情報が出せるようになるそうです。

ちなみに、みちびきやGPS等の測位衛星の位置を知ることができるアプリもあったりします。

  

 

地図や乗換案内、FacebookなどのSNS、他にも様々な場面でその場所の情報を得るためのGPS(≧ω≦)

日本版GPSのみちびきに期待です!

 

 

2017.10.16.会社案内を変更してみよう! その3

皆さん、こんにちは(・ω・)ノ

中村@新人です。

 

今回は会社案内ページ第三弾!

 

見本にしているページと同じようにアクセスマップを会社概要ページに纏めたいと思います♪

 

 

***  Googleマップの追加方法  ***

 

今回もいつも通りの右クリックから始まります

 

 

「コンテンツパーツ」から「パーツの追加」を選択!

 

 

「その他」のタブから「GoogleMaps-新規作成」を選択します。

 

 

地図が入りました

けれど、縮尺と設定が初期状態なので日本地図上でマークは東京を指しています。

ちゃんとした場所に設定をするためもう一度右クリックでメニューを開きます。

 

 

「Google Maps」から「プロパティ」を選択して編集画面を出します。

必須項目が「タイトル」「住所」「縮尺」「サイズ」と4つあるので、これを編集していきます。

タイトルは地図につけたい名前を入力しましょう。今回は無題のまま進めます。

 

まず、住所を変更!

 

 

ここで重要なのが「自動的に緯度経度取得を行う」にチェックを入れることです。

このチェックを忘れると地図のマークの位置が変わらないのでご注意ください。

 

 

縮尺は広域と拡大は8段階で選ぶことができます。

 

 

チェックを入れずに進めると広域地図が出ます。

右に行くにつれて拡大されていきます。

 

 

おススメは右から3つ目か4つ目辺り。

駅からの距離などで縮尺を決めると場所が分かりやすいです。

 

 

最後の必要項目のサイズはマップ自体の大きさになるので、今回はデフォルトの「100%×350px」で設定します。

設定が完了した地図がコチラ↓ 

 

 

 

見本には「アクセスマップ」の見出しがあったので、マップの上に見出しパーツを追加します。

もう一度「コンテンツパーツ」から「パーツの追加」を選択して、会社概要の見出しで使用している「見出し(h2)」を選びます。

 

 

見出しの文章をアクセスマップに変更して完成です!

 

 

 

無事、見本と同じ形の内容に編集できました♪

後はメニュー部分のタイトル変更と別ページのアクセスマップの削除ですが、今回はここまで!

 

次回の「Groopで作ってみよう」で紹介します(´∀`)ノシ 

 

 

 

 

 

 

 ↓↓↓ Groopを試してみたくなった方はこちらからどうぞ ↓↓↓ 

 

 

2017.10.10.会社案内を変更してみよう! その2

皆さん、こんにちは(・ω・)ノ

中村@新人です。

 

前回の「Groopで作ってみよう」で変更した会社案内!

 

 

予告していたとおり、今回は空いてしまっている隙間のつめ方を紹介します。

 

 

***  タグ編集で段落から改行へ  ***

 

この隙間…原因は見たまま編集をした時に自動的に入る<p></p>タグなのです。

 

と、いうことで今回は「フルエディタ編集」でタグを編集していきます! 

 

まず最初はいつも通り右クリックをして、「フリーページ」から「フルエディタ編集」を選択します。

 

 

編集画面の左下にある「ソース」をクリックして、タグの編集画面にします。

 

 

 

出てきたタグ編集画面でちょこっとタグを書き換えます。 

 

 

赤い枠で囲っている部分を変更していきます。

全部の行が<p></p>を使った段落になってしまっているため、あの隙間ができてしまっているのですね。

この<p></p>段落タグを<br>改行タグへ変更します。

 

 

全部変更したら「保存する」を選択して反映させます。

 

 

 

隙間がなくなってスッキリしました(*´ω`*)

 

 

ちなみに<p></p>タグをはずすだけだとこんな表示になります。 

 

 

 

何もいれていないので改行も段落もなく、ちょっと読みづらい形に……

書きたい内容や見せたい形によって「<p></p>段落タグ」、「<br>改行タグ」を使い分けていきましょう♪

 

 

 

 

そして、今回編集をしていて中村@新人を困らせたものが一つ(>ω<;)

 

 

 

保存をしてからもう一度開くと<br>がなぜか<br /> になってました。

先輩方に聞いたところ、HTMLにも「HTML」、「XHTML」、「HTML5」といくつか種類があって、この表記は「XHTML」に対応している書き方だそうです。

書いた内容と違う内容になっていてびっくりしますが、最新以外にも対応するための仕様なので安心してください♪

 

 

 ↓↓↓ Groopを試してみたくなった方はこちらからどうぞ ↓↓↓ 

 

 

2017.10.02.初心者さんのためのミニWEB語録 *** HTMLタグ紹介 -1- ***

 

皆さん、こんにちは(・ω・)ノ

中村@新人です。

 

今回は私が覚えたHTMLタグを一つ紹介します。

 

● <br> 改行タグ

<br>は文章の途中で改行したい時に使用する改行タグです。

通常タグは <p> 文章 </p> のように前後で挟まないといけないですが、<br>は文章の改行したいところに入れるだけでOKです。

 

どんな時に使うかというと…

例えば、長い文章があるとします。

 

昔々、あるところに、おじいさんとおばあさんが住んでいました。ある日、おじいさんは山へ柴刈りに、おばあさんは川へ洗濯に行きました。おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。おばあさんはその大きな桃を拾い上げて、家に持って帰りました。おじいさんとおばあさんが桃を切ってみると、中から元気の良い赤ちゃんが出てきました。子どものいなかったおじいさんとおばあさんは大喜びで、桃から生まれた男の子を桃太郎と名付けました。 (民話:桃太郎 冒頭部分)

 

こんな風に文章を区切らずにずらずら表示すると、ちょっと読みづらいですよね?

この文章を見やすくするのが<br>タグです(>ω<)

 

昔々、あるところに、おじいさんとおばあさんが住んでいました。
ある日、おじいさんは山へ柴刈りに、おばあさんは川へ洗濯に行きました。
おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。
おばあさんはその大きな桃を拾い上げて、家に持って帰りました。
おじいさんとおばあさんが桃を切ってみると、中から元気の良い赤ちゃんが出てきました。
子どものいなかったおじいさんとおばあさんは大喜びで、桃から生まれた男の子を桃太郎と名付けました。
(民話:桃太郎 冒頭部分)

 

全ての「。」の後に<br>を付けてみました。少し区切るだけでだいぶ読みやすくなりましたね。

ちなみにタグを表示するとこんな感じです↓

 

改行されるなら前に出てきた<p></p>の段落タグでもいいんじゃないの?と思いますよね。

一言でいうと、それもOKです (・ω・)ノ

 

昔々、あるところに、おじいさんとおばあさんが住んでいました。

ある日、おじいさんは山へ柴刈りに、おばあさんは川へ洗濯に行きました。

おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。

おばあさんはその大きな桃を拾い上げて、家に持って帰りました。

おじいさんとおばあさんが桃を切ってみると、中から元気の良い赤ちゃんが出てきました。

子どものいなかったおじいさんとおばあさんは大喜びで、桃から生まれた男の子を桃太郎と名付けました。

(民話:桃太郎 冒頭部分)

 

「。」ごとに<p>タグで囲うとこんな感じで表示されます。

段落で区切ることになるので<br>で改行したものに比べて幅がありますが、同じような見た目ですよね。

 

なら、一緒でいいんじゃないの?と思いますが、ちょっとだけ違いがあります。

目で見て分かりやすくするなら…

 

<br>の場合

「昔々、あるところに、おじいさんとおばあさんが住んでいました。
ある日、おじいさんは山へ柴刈りに、おばあさんは川へ洗濯に行きました。
おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。
おばあさんはその大きな桃を拾い上げて、家に持って帰りました。
おじいさんとおばあさんが桃を切ってみると、中から元気の良い赤ちゃんが出てきました。
子どものいなかったおじいさんとおばあさんは大喜びで、桃から生まれた男の子を桃太郎と名付けました。
(民話:桃太郎 冒頭部分)」

 

<p></p>の場合

「昔々、あるところに、おじいさんとおばあさんが住んでいました。」

「ある日、おじいさんは山へ柴刈りに、おばあさんは川へ洗濯に行きました。」

「おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。」

「おばあさんはその大きな桃を拾い上げて、家に持って帰りました。」

「おじいさんとおばあさんが桃を切ってみると、中から元気の良い赤ちゃんが出てきました。」

「子どものいなかったおじいさんとおばあさんは大喜びで、桃から生まれた男の子を桃太郎と名付けました。」

「(民話:桃太郎 冒頭部分)」

 

段落を一つの文章として「」をつけると、こんな感じで違いが出てきます(>ω<;)

<p></p>は「。」ごとに一つの段落として区切っているので「」が多くなってます。

<br>は一つの文章の中で改行をしているだけなので「」が一つだけになるんですね。

 

 

じゃあ、一つの文章にしたいものは全部<br>で区切ったらいい……とは限らないところが気をつけたいポイントなのです!

 

パソコンとスマートフォンって画面のサイズが違いますよね?

最近はノートパソコンやタブレット・スマートフォンと色んな画面サイズがあるので、使っている物によって横幅の文字数が変わってきます。

 

例えばパソコンだと↓こう見えますが、

 

スマートフォンのサイズだと↓こう見えます。

 

今回は「。」で区切っているのであまり気にならないのですが、読みやすくしようと文章の真ん中などで改行してしまうと、パソコンではキレイに見えていても、スマートフォンやタブレットでは変なところで区切られている謎の見え方になっている場合があります。

 

そんな理由から最近は「<br>を使わない」ということが多くなっているのですが、必要になる場面もちょこちょこあるので覚えておきましょう♪

 

 

 

無料で今すぐ作ってみる

ブログ内検索

フィード

分からないこと、聞きたいことご相談頂ければわかりやすく・丁寧にお答えいたします。

PAGE TOP