제 웹페이지 URL : http://kimbapp.com
사용 XE버젼 : XE최신 버젼 1.8.15
사용 레이아웃 : 기본 레이아웃
사용 호스팅 : cafe24
Q. 최신글 게시판 위젯에다가 jpg 파일을 넣고 싶어 html 코딩을 보려면 어떻게 해야 하나요? 아니면 html 코딩으로 <img src=" url address">하는 방법 말고 다른 방법이 있을까요?
아래 사진을 보시면 아시겠지만 제 웹페이지의 모바일 버젼은 Free Board와 같이 게시판 제목만 써져있습니다. 여기에 아래 사진처럼 게시판 제목 옆에 이미지 파일을 넣고 싶습니다.
< 제 웹페이지의 모바일 버젼 - 텍스트밖에 없음>

<제가 따라하고 싶은 사진 - 게시판 제목 옆에 사진 넣기>

제 생각에는 게시판 제목 옆에 사진을 넣으려면 html 코딩을 만져서 <img src=" ">를 넣어야 한다고 생각했는데요. xe에서 관리자 페이지를 아무리 들어가보아도 위젯의 html코딩을 보여주는 화면은 없더라고요. 참고로 저는 메인페이지를 위젯페이지로 만들고, 그 위젯페이지에서 [페이지 수정] - [Content 위젯 추가]의 방식으로 제 웹페이지의 최근 글 위젯을 만들었습니다.
( 제가 참고한 글 : http://www.xeschool.com/xe/step1_19 "최근 게시글 꾸미기")
혹시 1) 어떻게 위젯의 html 코딩을 볼 수 있는지,
2) 아니라면 html 코딩을 보지 않더라도 위젯에 쓰여져 있는 텍스트 옆에 이미지를 추가할 방법이 있는지
알려주신다면 정말로 감사하겠습니다.
댓글 7
이런 식으로 들어가셔서 수정하시면 될거에요.
또 다른 방법으로는 아이콘을 사용하실 수도 있겠네요
http://xpressengine.github.io/XEIcon/started.html
이쪽 참고해보세요
위젯스타일은 경로가 widgetstyles / 사용하시는 위젯스타일
이런 식입니다.
답변해주셔서 감사합니다. 그런데 2가지 질문만 더 여쭈어 봐도 될까요?
Q1. 알 ftp에서 위젯스타일 폴더에 보니 simple 한가지 폴더밖에 없더라구요. 그런데 이 폴더 안에 들어있는 4가지 파일 중에서 어느 file을 어느 프로그램으로 편집하면 될까요?
Q2. html 코드로 <img src=" "> 를 추가하려고 widgetstyle.html 파일을 "Microsoft Word"로 편집하려 하니 아래 사진과 같이 뜨더라구요. 그런데 제 게시판 제목인 "Free Board"나 "Love & Relationshp"들은 하나도 보이지 않더라구요. 어디에 img src를 넣으면 되는 걸까요?
네 맞아요. 제목별로 서로 다른 이미지를 넣으려고 생각하고 있습니다! widgetstyle.html 이라고 제가 잘 찍었네요!!
그러시면 아이콘을 사용하시는 편이 간단할 것 같네요.
레이아웃 <head></head> 안에
<link rel="stylesheet" href="//cdn.jsdelivr.net/xeicon/1.0.4/xeicon.min.css">
위 코드를 넣으시고
위젯스타일 제목 입력하는 곳에 가셔서
http://xpressengine.github.io/XEIcon/started.html
이곳의 안내에 따라 <i class="xi-xpressengine"></i> 이런 식으로 입력하시면 됩니다.
예)) <i class='xi-xpressengine'></i> 자유 게시판
여기가 위젯의 제목이 들어가는 부분입니다.
word 말고 notepad++ 같은 무료 소프트웨어 다운받아서 편집하시면 좋을거에요..