일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
Tags
- function
- jquery
- 설정
- codeigniter3
- javascript
- 그누보드
- 코드이그나이터
- APK
- php
- 라이렌
- 옵션표
- 후크
- rairen
- 영카트
- Database
- 헬퍼
- phpDocumentor
- 안드로이드
- jw player
- mysql
- html
- CI3
- FCM
- ajax
- MSsql
- 웹 프로그래밍
- API
- 함수
- CodeIgniter
- config
Archives
- Today
- Total
프로그램 개발서
메타 태그 본문
안녕하세요?
실 사용하는 코드에 대한 정보를 공유겸 저장겸 기록겸 작성는 오늘의 내용은 메타태그입니다.
<head></head> 안에 넣어서 사용하는 태그로서 홈페이지에 대한 정보를 작성하는 태그라고 보시면 간단하지 않을까 싶습니다.
우선 아래의 코드를 봅시다.
<meta name="author" content="라이렌">
<meta name="description" content="Work Management System">
<meta name="keywords" content=" Work Management System">
<meta name="subject" content="Work Management System">
<meta name="title" content="Work Management System">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="robots" content="noindex, nofollow"/>
<meta http-equiv="Content-Type" content="text/html">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta property="og:title" content="Work Management System"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://myhomepage.com"/>
<meta property="og:image" content="http://example.com/ogp.jpg"/>
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg"/>
<meta property="og:image:type" content="image/jpeg"/>
<meta property="og:image:width" content="400"/>
<meta property="og:image:height" content="300"/>
<meta property="og:image:alt" content="A shiny red apple with a bite taken out"/>
<meta property="og:audio" content="http://example.com/sound.mp3"/>
<meta property="og:audio:secure_url" content="https://secure.example.com/sound.mp3"/>
<meta property="og:audio:type" content="audio/mpeg"/>
<meta property="og:description" content="Work Management System"/>
<meta property="og:determiner" content="the"/>
<meta property="og:locale" content="ko_KR"/>
<meta property="og:locale:alternate" content="en_US"/>
<meta property="og:site_name" content="Work Management System"/>
<meta property="og:video" content="http://example.com/movie.swf"/>
<meta property="og:video:secure_url" content="https://secure.example.com/movie.swf"/>
<meta property="og:video:type" content="application/x-shockwave-flash"/>
<meta property="og:video:width" content="400"/>
<meta property="og:video:height" content="300"/>
<meta name="twitter:card" content="summary"/>
<meta name="twitter:site" content="@nytimesbits"/>
<meta name="twitter:creator" content="@nickbilton"/>
위 코드는 사용할 만한 메타 태그들을 다 작성한 것입니다.
다만 기본적으로는 아래의 정도만 넣어도 충분하죠.
<meta name="author" content="라이렌">
<meta name="description" content="Work Management System">
<meta name="keywords" content=" Work Management System">
<meta name="subject" content="Work Management System">
<meta name="title" content="Work Management System">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="robots" content="noindex, nofollow"/>
<meta http-equiv="Content-Type" content="text/html">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta property="og:title" content="Work Management System"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="<?= site_url(); ?>"/>
<meta property="og:description" content="Work Management System"/>
<meta property="og:determiner" content="the"/>
<meta property="og:locale" content="ko_KR"/>
<meta property="og:locale:alternate" content="en_US"/>
<meta property="og:site_name" content="Work Management System"/>
홈페이지의 이미지나, 음악, 영상 등을 보함하고 싶을 때는 각각 추가해주면됩니다.
* 이미지
<meta property="og:image" content="http://example.com/ogp.jpg"/>
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg"/>
<meta property="og:image:type" content="image/jpeg"/>
<meta property="og:image:width" content="400"/>
<meta property="og:image:height" content="300"/>
<meta property="og:image:alt" content="A shiny red apple with a bite taken out"/>
* 음악
<meta property="og:audio" content="http://example.com/sound.mp3"/>
<meta property="og:audio:secure_url" content="https://secure.example.com/sound.mp3"/>
<meta property="og:audio:type" content="audio/mpeg"/>
* 영상
<meta property="og:video" content="http://example.com/movie.swf"/>
<meta property="og:video:secure_url" content="https://secure.example.com/movie.swf"/>
<meta property="og:video:type" content="application/x-shockwave-flash"/>
<meta property="og:video:width" content="400"/>
<meta property="og:video:height" content="300"/>
그리고 마지막으로는 SNS 에서 읽어들일 경우 사용하는 메타태그도 있습니다.
<meta property="og:title" content="Work Management System"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://myhomepage.com"/>
<meta property="og:description" content="Work Management System"/>
<meta property="og:determiner" content="the"/>
<meta property="og:locale" content="ko_KR"/>
<meta property="og:locale:alternate" content="en_US"/>
<meta property="og:site_name" content="Work Management System"/>
<meta name="twitter:card" content="summary"/>
<meta name="twitter:site" content="@nytimesbits"/>
<meta name="twitter:creator" content="@nickbilton"/>
위 내용이 SNS용이라고 보시면 될 것 같네요.
참고용이므로 참고하시어 작성하시면 됩니다.
반응형
'Web' 카테고리의 다른 글
[DB][MySQL] 시/도, 시/군/구, 읍/면/동 .sql (0) | 2021.07.05 |
---|---|
Favicon HTML link Tag (0) | 2020.06.08 |
[코드이그나이터] Custom Helper Function 모음 - Default (0) | 2020.05.29 |
[코드이그나이터] Custom Helper 모음 v0.1 (0) | 2020.05.20 |
[Jquery][CodeIgniter] 회원가입 관련 코드 모음. (0) | 2020.05.20 |