2024년 11월 17일 일요일

홈페이지형 네이버 블로그 만들기 (이미지 링크 버전)

간단 내용

홈페이지형 네이버 블로그 만들기 (이미지 링크 버전)

상단 백그라운드 이미지, 백그라운드 이미지 하단에 버튼

화면 캡처

세부 디자인 설정


https://www.figma.com/ 에서 배경, 버튼 제작


스킨배경 직접등록


background-1920x780.png

0.09MB


비공개로 버튼 올리기 (네이버 블로그 웨젯 크기는 최대 가로 170px 세로 600px 까지 지원)

버튼 오른쪽 클릭후 이미지 주소 복사해 놓기


button-generativeaianywhere-170x150.png

0.00MB


button-naver-cafe-170x150.png

0.00MB


button-youtube-170x150.png

0.00MB


레이아웃 위젯 설정


우측에서 두번째 레이아웃 선택


위젯직접등록 클릭해 위젯 등록


테이블투명위젯1, 테이블투명위젯2, 테이블투명위젯3, 테이블투명위젯4, 테이블투명위젯5 (네이버 블로그 웨젯 크기는 최대 가로 170px 세로 600px 까지 지원)

<table>
<tbody>
<tr>
<td width="170" height="530">
</td>
</tr>
</tbody>
</table>


위젯직접등록 클릭해 버튼 등록


버튼위젯1

위에서 복사해 놓은 이미지 주소 src 옵션으로 사용

<a href="https://www.generativeaianywhere.ai/" target="_blank">
<img src="https://postfiles.pstatic.net/MjAyNDExMThfMTIz/MDAxNzMxODU1OTY2Mjg5.55rtocF4Xf2k4BULK0dapTXtfhTGz2UdscDD5KolXHQg.5jV4rmvwiWc2TfuBMEwPawFJtx9rxNnzftTu_5d3b_8g.PNG/button-generativeaianywhere.png?type=w773" width="170" height="150" border="0" />
</a>


버튼위젯2

<a href="https://cafe.naver.com/automatethem" target="_blank">
<img src="https://postfiles.pstatic.net/MjAyNDExMThfMTk3/MDAxNzMxODU1OTczMjc1.pAefB0f3sjPUd2ULjErSXDGo690gsKF-Zsrxv9GZB74g.bsaBzKH3LyR_uSoj_NUrZrWUPY1jgWgknQI_3chpMnkg.PNG/button-naver-cafe.png?type=w773" width="170" height="150" border="0" />
</a>


버튼위젯3

<a href="https://www.youtube.com/@automatethem" target="_blank">
<img src="https://postfiles.pstatic.net/MjAyNDExMThfMjkw/MDAxNzMxODU1OTc3MzY0.SPyvcjDnyxrz2u8Bya-HjS9KYEX64RG7KvAAuESvMrYg.AZTP4gwi_jAIbbXsxSm4TBxHIbWpvXTADWeJVzy0zw4g.PNG/button-youtube.png?type=w773" width="170" height="150" border="0" />
</a>



결과 화면

상세 내용

홈페이지형 네이버 블로그 만들기 (이미지 링크 버전)

상단 백그라운드 이미지, 백그라운드 이미지 하단에 버튼


홈페이지형 네이버 블로그 예
https://blog.naver.com/marketinganywhere

홈페이지형 네이버 블로그 만들기 (이미지 링크 버전)
https://marketinganywhere.tistory.com/68

홈페이지형 네이버 블로그 만들기 (이미지맵 링크 버전)
https://marketinganywhere.tistory.com/67

장점

이미지 맵 링크 버전과 비교해 구현이 단순함

단점

앱 주소

https://blog.naver.com/


이미지 편집기 모음
https://marketinganywhere.tistory.com/48

리뷰 동영상

강의 동영상

네이버 홈페이지형 블로그 쉽게 만들기 1편 (포토샵100%활용) - YouTube


네이버 홈페이지형 블로그 쉽게 만들기 2편 (포토샵100%활용) - YouTube


네이버 홈페이지형 블로그 쉽게배우기 3편 (포토샵100%활용) - YouTube


참고 자료

태그

#홈페이지형, #네이버블로그, #블로그만들기, #이미지링크, #블로그디자인, #네이버블로그팁, #홈페이지제작, #블로그꾸미기, #블로그활용법, #이미지링크사용법

Sns

https://marketinganywhere.tistory.com/68

 https://blog.naver.com/marketinganywhere/223664186375

 https://marketing-anywhere.blogspot.com/2024/11/blog-post_17.html

작성 도구

본 글은 웹페이지 어디서나 마케팅 관련 작업을 쉽게 할 수 있게 도와주는 무료 오픈 소스 메타 생성형 Ai 크롬확장 앱인 "마케팅 애니웨어"에 의해 작성되었습니다.
https://www.marketinganywhere.ai/

내부용

홈페이지형 네이버 블로그 만들기 (이미지 링크 버전) 용 비공개 버튼위젯
https://blog.naver.com/marketinganywhere/223664218681

댓글 없음:

댓글 쓰기

HTML 미리보기 도구 - 웹 개발을 간편하게 만드는 무료 온라인 유틸리티

HTML 미리보기 도구란 무엇인가요? HTML 미리보기 도구 는 HTML 코드를 작성하면서 실시간으로 결과를 확인할 수 있는 간단하고 유용한 온라인 툴입니다. 이 도구는 웹 개발자는 물론, HTML을 배우는 학생들, 그리고 빠르게 디자인 프로토타입...