본문 바로가기

티스토리스킨/반응형2단 스킨

티스토리 스킨 - 반응형 2단 매거진C 티스토리 스킨 배포합니다.

스킨명 : 티스토리 반응형 2단 매거진C

주요 특징들


- 레이아웃 주변에 여백 공간과 그림자 효과를 지정해 공중에 떠있는 느낌을 줄 수 있습니다.

- 레이아웃 주변에 둥근 모서리 효과를 줄 수 있습니다.

- 마우스오버, 하이라이트, 테마 컬러를 설정에서 변경할 수 있습니다.

- 사이드바를 왼쪽/오른쪽으로 이동시킬 수 있습니다.

- 카테고리 메뉴를 탑메뉴, 또는 사이드 메뉴로 변경할 수 있습니다.

- 커버 슬라이드를 풀화면 헤더 영역, 또는 컨텐츠 영역에 배치할 수 있습니다.

- 블로그 타이틀 컬러, 타이틀 이미지 대체, 헤더 영역 배경 이미지 표시 등 다양한 데코레이션을 넣을 수 있습니다.

- 카카오맵을 커버페이지에 붙일 수 있습니다.(카카오 개발자 사이트 가입 및 설정 필요)


---------------------------------------------------------
2019-06-03 ver 1.0.3 patch - 카카오맵 커버 기능 삭제
2019-06-01 ver 1.0.2 patch - 모바일 검색폼 클릭시 사이드 메뉴 닫히는 버그 패치

2019-05-27 ver 1.0.1 patch - 모바일 사이드메뉴 스크롤락 호환성 개선
---------------------------------------------------------





* 웹브라우저 너비를 변경하면 반응형으로 변경되는 레이아웃을 확인할 수 있습니다.








- 스킨 설정 안내





레이아웃


사이드바 위치 : 사이드바 배치를 왼쪽, 오른쪽 중 선택.


카테고리 위치 : 카테고리를 탑메뉴로 표시, 또는 사이드바 항목으로 표시


커버 배너 위치 : 커버 슬라이드 사용시 커버 슬라이드 배너 표시 위치를 헤더위치에 풀배너로 표시, 또는 컨텐츠 표시 영역에 다른 커버 아이템과 같이 표시.


사이드 테두리 그림자 적용 : 레이아웃 좌우 경계선 영역에 그림자 효과를 표시합니다. 밝은색 배경에 사용하면 경계선 구분이 잘됩니다.



공통/페이지


스킨 배경 이미지 사용 : 전체 스킨 배경 이미지를 표시할지 선택. 기본 배경 이미지는 body-bg.jpg 이며 스킨팩 images 폴더 안에 있습니다. 배경 이미지를 변경하려면 동일한 이미지로 배경 이미지를 제작해 업로드 하면 됩니다.


스킨 배경색 선택 : 스킨 배경 이미지를 사용하지 않을 경우 사용하는 스킨 전체 배경새을 지정합니다.


하이라이트 칼라 : 스킨의 테마컬러, 마우스 오버 컬러를 선택합니다.


짧은 날짜 사용 : 블로그 기본 시간 표시 방법은 년월일시분초입니다. 년월일만 표시되도록 하려면 활성화합니다. 댓글, 방명록, 아카이브에는 적용되지 않습니다.


검정색 글 본문 색상 적용 : 활성화하면 글보기 본문 텍스트의 색상을 검정색으로 강제 지정합니다. 본문 글의 주목도를 높이고 싶은 경우에만 사용합니다.


페이징 타입 : 이전/다음페이지, 이전/다음글 을 이동하는 방식을 선택합니다. 더보기, 이전/다음, 페이지목록 중 한가지를 선택할 수 있습니다.


탑 스크롤 버튼 사용 : 페이지 최 상단으로 애니메이션되어 스크롤 업하는 버튼을 표시합니다.


페이지리스트,탑스크롤 둥근모서리 : 페이징과 탑스크롤 버튼 배경 영역을 원으로 표시합니다. 끌 경우 사각형으로 표시


레이아웃 모서리 둥글게 : 스킨 전체 레이아웃의 모서리 부분을 둥글게 처리해 둥근 사각형 형태로 만듭니다.



헤더


좁은 헤더 높이 사용 : 헤더 영역 높이값을 100px 줄입니다.


헤더 배경 이미지 사용 : 헤더 여역에 배경 이미지를 표시합니다. 기본 이미지 파일명은 header-bg.jpg 입니다. 헤더 이미지를 변경하려면 같은 파일 이름으로 변경할 이미지를 만들어 업로드하면 됩니다.


블로그 타이틀 색상 선택 : 블로그 타이틀 텍스트를 표시할 경우 색상을 지정합니다.


타이틀 대체 이미지 : 대체 이미지를 업로드하면 블로그 타이틀 텍스트 표시 자리에 업로드한 이미지가 표시됩니다.



사이드바

사이드바 최근글, 인기글 썸네일 표시 : 사이드바 최근글과 인기글 목록에 썸네일을 같이 표시할지, 아니면 텍스트만 표시할지 선택합니다.

프로필보기 : 상단 프로필 표시 여부를 선택합니다.


SNS아이콘 보기 : 상단 SNS 아이콘 표시 여부를 선택합니다.



푸터


푸터 이미지 표시 : 블로그 메뉴 위쪽에 표시할 이미지 업로드.(회사 로고 등)


푸터 텍스트 표시 : 블로그 메뉴 위쪽에 푸터 텍스트(회사 정보나 주소 등) 표시


블로그 메뉴 표시 : 블로그 메뉴를 표시할지 선택



카카오맵


카카오맵 사용 : 카카오맵 커버 기능은 삭제되었습니다.



- 커버페이지 설정 안내




커버 항목은 다음과 같은 종류가 있습니다.

슬라이더 커버를 제외하고 나머지 항목은 갯수 제한이 없습니다.


슬라이더 - 스킨 전체에 1개만 있습니다. 추가 생성하면 레이아웃이 깨집니다. 기본 생성된 것을 그냥 사용합니다. 홈페이지 최상단 메인 영역을 차지하는 로테이션 배너입니다.

배너 로테이션 타임은 script.js 23행에서 숫자를 변경하면 됩니다. 5000은 5초입니다.(초*1000)

0을 입력하면 자동 로테이션이 멈춥니다.


이미지 썸네일 리스트 - 하이퍼링크가 있는 썸네일 리스트입니다. 링크는 "더보기" 버튼으로 별도로 표시됩니다. 커버 아이템 갯수는 2, 3, 4, 6, 8개를 사용해야 레이아웃이 정확하게 맞습니다. 1개인 경우는 가로 풀배너를 사용합니다.
"더보기" 버튼은 하이퍼링크 입력값 여부에 따라 자동으로 표시됩니다.



이미지 썸네일 리스트[링크x] - 하이퍼링크 없는 썸네일 리스트입니다. 입력한 타이틀과 내용은 썸네일 이미지 마우스 호버시 표시됩니다.(모바일에서는 기본 표시 상태로 바뀝니다.) 커버 아이템 갯수는 2, 3, 4, 6, 8개를 사용해야 레이아웃이 정확하게 맞습니다. 1개인 경우는 가로 풀배너를 사용합니다.





가로풀배너 - 가로 전체 너비로 표시되는 통 배너입니다. 커버 아이템을 1개만 생성해야 합니다.




카카오맵 표시 카카오맵 커버 기능은 삭제되었습니다.


메뉴링크 사이트맵 - 사이트 맨 위에 표시되는 메뉴를 클릭했을 때 이동할 위치를 지정합니다. 타이틀에 사이트맵 링크 ID를 입력합니다.

메뉴 항목별 하이퍼링크에는 "#+링크ID" 를 입력하면 됩니다.

메뉴 하이퍼링크는 skin.html 30 ~ 49행 사이에 위치합니다.


각 커버 항목 왼쪽의 햄버거 아이콘을 드래그하면 커버 항목이 표시되는 순서를 변경할 수 있습니다.







_설치안내


1. index.xml 파일을 반드시 업로드해야 합니다. 티스토리 신스킨은 스킨 옵션 설정을 위해 반드시 이 파일이 필요합니다.


2. script.js 파일 업로드 후에는 웹브라우저 캐시 소거를 한번 해주시기 바랍니다. 브라우저 환경에 따라 구 사용 스킨의 자바스크립트 파일이 캐시에 남아 자바스크립트가 정상 동작하지 않는 경우가 있습니다.

사이드바 메뉴가 펼쳐지지 않는다거나 할 경우 캐시 소거를 하면 됩니다.


3. 커버 페이지 구성시 커버 슬라이드는 1개만 사용해야 합니다. 추가로 생성하면 레이아웃이 깨집니다.




스킨 설치 방법








  • 비밀댓글입니다

    • 제목행이 넘쳐서 본문 영역과 겹치네요.
      제목을 이렇게 길게 쓰는 경우에 대한 대응이 안되게 되어있습니다.
      스킨 원본 기준 style.css
      1494행 1495행 사이에

      overflow: hidden;

      행을 추가해주면 겹치는 현상이 사라지고 제목이 1줄에서 잘립니다.

    • 예! 알려주신대로 적용했더니, 크롬에서는 해결이 되었는데 익스플로러에서는 텍스트가 홍수가 나있습니다! 방법이 있을까용?....

    • 포토갤러리가 애초에 만든 목적이 글을 붙이는게 아니라 포토 링크 개념으로 커버에서 이미지랑 타이틀을 붙이는 것이어서 지금 적용하신거 같이 글 링크를 거는 경우에 대한 대응이 안됩니다.

      스킨 패치는 따로 되겠지만, 일단 적용하신 블로그에

      style.css 에서

      1.
      위에서부터
      .cover-gallery ul li .content {

      찾으시고
      (스킨 원본에는 1470행으로 나옵니다.)

      max-height: 5.4em;
      속성 추가

      2.
      위 답변의 overflow: hidden;을 추가한 클래스

      .cover-gallery ul li .content .title{
      를 찾아(위 1번 클래스 바로 밑에 있습니다.)

      클래스에
      display: block;
      속성 추가

      3.
      2번 밑에

      .cover-gallery ul li .content .excerpt{
      클래스에
      font-size: 0.925em;
      속성 추가
      (타이틀이랑 구분해주기 위한 데코레이션입니다.)

      클래스가 모바일 미디어 쿼리에도 나오니까 주의하셔야 합니다.
      상단의 데스크톱 클래스에만 적용하면 됩니다.

    • 크으..! 완벽해요!! 정말 감사합니다!! 너무 예뻐요! 잘 사용하겠습니다 !!!!

  • 이미지셈네일리스트에 더보기 및 글내용을 없애고 제목만 표시되게 할 수 없나요. 심플하게 하고 싶어서요. 그리고 셈네일 크기를 더 작게 조정하는 방법은 없나요? 잘 쓰고 있는데 수정 방법이 너무 복잡하면 안 가르쳐 주어도 됩니다. 고맙게 잘 쓰고 있습니다. 그리고 프로필 이미지 사각형으로 사이드바 크기에 꽉차게 하는 방법도요. 너무 많은 질문드려 죄송합니다.

    • 1.
      스킨 원본 기준 skin.html
      281 ~284행을 지우면 글내용과 더보기가 삭제됩니다.
      대신 글 하이퍼링크를 달아야 하므로
      280행(제목) 앞뒤에 하이퍼링크 태그를 추가해줘야 합ㄴ디ㅏ.
      <a href=""><!-- 제목 태그 --></a>

      이미지 자체를 클릭할 수 있게 하려면
      278행에도 위 하이퍼링크를 추가해주는 것과 같이 추가해주면 됩니다.


      2.
      현재 스킨은 이미지 썸네일의 한줄 갯수에 따라 크기가 자동으로 조정되도록 정해져 있습니다.(퍼센트값)
      이미지 썸네일 리스트에 2개 3개 4개 6개(2줄) 8개(2줄) 이렇개 갯수에 따라 이미지 크기가 자동으로 작아집니다.
      스킨 편집기에서 이미지썸네일 목록에 아이템을 여러개 추가해보시기 바랍니다.


      3.
      스킨 원본기준 style.css 에서

      .blogger-profile .thumb-profile img
      을 검색해서(211행)

      .blogger-profile .thumb-profile img{
      width: 100%;
      height: auto;
      border-radius: 0;
      }

      으로 변경

      .blogger-profile
      을 검색해서(194행)

      height: 100px;

      속성을 삭제.
      또는 .blogger-profile 클래스 전체를 삭제해도 됩니다.

  • 현상군 2019.06.28 11:27 댓글주소 수정/삭제 댓글쓰기

    친절하게 답변달아 주셔서 감사합니다.
    2번째는 해결되었는
    1번째는 제 능력 밖이네요.
    아무튼 감사합니다.
    스킨 잘 쓰겠습니다.

    • 생각보다 그렇게 어렵지 않습니다.
      1번은 다음과 같이 하시면 됩니다.
      skin.html 의
      278~285행을
      아래 내용으로 전체 대체하시면 됩니다.

      아래 내용에서
      샵샵 -> ##
      으로 변경후 적용하셔야 합니다.

      <span class="thum">
      <a href="[샵샵_cover_item_url_샵샵]">
      <s_cover_item_thumbnail><img src="//i1.daumcdn.net/thumb/C400x300/?fname=[샵샵_cover_item_thumbnail_샵샵]" alt=""></s_cover_item_thumbnail>
      </a>
      </span>
      <div class="article-info">
      <a href="[샵샵_cover_item_url_샵샵]"><span class="title">[샵샵_cover_item_title_샵샵]</span></a>
      </div>

  • 정말 감사합니다.
    님께서 해주신대로 해서 성공했습니다.
    스킨 잘 쓰겠습니다.
    다시 한번 친절한 답변 감사합니다.

    https://currenteyes.tistory.com/

  • 좋은 스킨 만들어주셔서 정말 감사합니다!

    한가지 질문이 있는데,
    본문 크기는 700px 정도, 사이드바 크기는 300px 로 세팅하고 싶은데,
    어떤 값들을 변경하면 될까요?

    시간 되실 때 답변 부탁 드립니다.

    고맙습니다.

    • style.css 파일에서
      사이드바 너비와 컨텐츠 영역 너비를 수정해주면 됩니다.
      컨텐츠 영역은 미디어 쿼리로 너비값 변하는데 따라 맞춰주는 부분이 있어서 여러군데를 수정해야 합니다.(반복되는 것이어서 그렇게 어렵지는 않습니다.)

      1.
      사이드바 너비 수정
      .sidebar 검색
      (스킨 원본기준 509라인)
      513행에 너비값 속성이 250px로 정의되어 있습니다. 원하는 크기만큼 늘려줍니다.
      참고로 사이드바와 컨텐츠 영역에 30px 여백이 있습니다. 따라서 실제로는 280px 영역을 차지합니다.
      사이드바가 너무 넓어지면 보기 좋지 않으므로 적당히 더해줍니다.(늘리는 만큼 컨텐츠 영역을 줄여야 하므로 컨텐츠 영역에 표시되는 내용이 그만큼 좁아지는 걸 감안해야 합니다.)


      2.
      style.css 에서 #content 검색
      793행의
      width: 880px;
      값을 사이드바 넓힌 만큼 축소
      그리고
      @media로 정의된 #content 너비값을 모두 줄여줘야 합니다.
      스킨 원본기준 2456행부터입니다.
      2461행, 2469행, 2477행, 2495행 의
      width 속성 값을 #content에서 줄인 크기만큼 동일하게 줄여주면 됩니다.

      3.
      조금 더 복잡해지지만, 전체 레이아웃 너비를 더 넓혀서 컨텐츠 영역까지 넓혀서 아얘 큰 레이아웃으로 하려면

      #wrap 검색
      style.css 원본기준 147행

      147행 max-width: 1220px;
      으로 정의된 값을 원하는 픽셀 만큼 증가.
      증가한 값만큼
      @media 미디어 쿼리 너비값들도 증가
      2456행, 2464행, 2472행, 2490행, 2516행의 max-width 값도 같은 크기만큼씩 증가

      그리고
      2458행, 2466행, 2474행, 2492행의 레이아웃 너비 값도 같은 크기만큼씩 증가

      해주면 레이아웃도 넓어집니다.

      단, 3번부터 하고 1번 2번을 해야 계산이 쉽고 간결합니다.


      ie 호환성 때문에 미디어쿼리 정의가 많아서 다소 수정할 부분이 많은 불편함이 있습니다.

  • 상세한 답변 감사합니다.

    제가 원하는 것은
    - 본문 영역 700px
    - 사이드바 영역 300px 인데,

    위에 알려주신대로 3 > 2 > 1 순서대로
    3. 전체 레이아웃을 130px 씩 줄이고
    2. content를 700px 로 변경하고
    1. sidebar 를 30px 로 변경했습니다.

    그랬더니 현재 적용된 것처럼 본문 영역이 700px, 사이드바가 300px 로 줄어든건 확인이 되었는데,
    본문이 우측으로 밀린 것처럼 왼쪽 영역이 커져버렸습니다.

    전체 사이즈와의 연관 관계가 안맞아서 그런 듯 한데,
    혹시 이 경우, 수치를 어떻게 조정하면 좋을까요?

    다시 한 번 답변해주셔서 감사합니다!

    • 블로그 손보고 있는거 같네요.

      본문영역 700
      사이드영역 300
      본문과 사이드 사이 공간 30
      본문과 사이드 합한 컨텐츠 영역과 경계선 사이 좌우가 각각 30씩
      여백이 있습니다.

      따라서 여백 공간 합이 총 +90이 되고
      전체 레이아웃은 1090 이 되는 식으로 계산을 합니다.

      블로그에 가보니
      전체 레이아웃 너비값을 1220으로 해놓으셨습니다.

      style.css 위에서부터 처음 나오는
      #wrap > .inner
      를 검색하시면 1220px로 width 가 되어있을 겁니다.
      (현재 블로그 기준 style.css 155행)
      이걸 1090px로 변경하면
      바로 레이아웃이 맞아서 붙을겁니다.

      나머지는 가변으로 자동으로 줄어드니까.. 일단 이렇게 하고 안맞는 부분은 추가로 맞춰나가면 될겁니다.

    • inner 쪽에도 하나 더 있었군요!
      전체적인 구조를 이해했습니다.

      좋은 스킨 만들어주셔서 .. 그리고 상세한 답변 해주셔서 다시 한 번 감사드립니다.

      덕분에 5년만에 좋은 스킨으로 변경했습니다 :)

    • =^^=/

  • 안녕하세요~ 너무 이쁜 스킨 공유해 주셔서 감사합니다.
    질문 하나 드려봐용!
    젤 위에 슬라이더되는 메인 이미지 상단에 메뉴? 목록 같은게 있는 구간이 파랑색인데 이 색깔을 바꿀수 있을까요?

    • 파랑색이 아니라 반투명 흰색으로 배경 이미지가 비쳐보이는 것입니다.

      헤더상단
      .category-top #header .category-menu
      헤더하단
      .category-bottom #header .category-menu

      요 클래스를 style.css에서 검색해서 찾으시면 배경색 속성으로

      background-color: rgba(255, 255, 255, 0.3);

      요게 있습니다.

      흰색을 30% 불투명으로 설정하는것입니다.

      0.3 을 1.0으로 바꾸면 완전 불투명 흰색으로 되고

      255,255,255 요 RGB 값을 다른걸로 바꾸면 컬러 반투명, 또는 해당 컬러로 바꿔줄 수 있습니다.

      rgba(R,G,B,투명도);
      이런구조입니다.

      원하는 RGB 컬러값을 찾으시려면
      구글 검색으로 "color picker" 로 검색어를 주면
      검색 결과에 바로 컬러값을 찍어볼 수 있는 화면이 나타납니다.

  • 와우! 정말 감사합니다!!
    일단 공감, 구독 누르고 말씀 드립니다~
    하나만 더 질문 드려도 될까요 ㅠㅠ
    메인에 보이는 사진들을 타이틀 사진처럼 모서리가 둥글게 바꿀수 있는지 궁금합니다!
    사이드바에 보이는 최근게시물, 인기게시물의 작은 사진도 포함해서 질문 드립니다 ~

    • 메인이라고 하신게 아마도 커버페이지가 아닌가 싶은데...

      스킨 원본기준
      style.css 900행 위에

      .cover-wrap img, .cover-wrap ul li .thum, .cover-wrap.cover-banner ul li{
      border-radius: 20px;
      }
      을 추가하면 커버페이지 전체에 있는 이미지에 둥근 모서리(반지름 20px) 가 적용됩니다.
      반지름 값은 적당히 원하는 정도로 조정해주면 됩니다.

      마찬가지로

      둥근 모서리를 적용하고 싶은 위치에
      border-radius: 반지름픽셀값px;

      를 추가해주면 됩니다.

      사이드바 최근글 인기글 썸네일은

      스킨 원본 기준 style.css
      768행
      .recent-posts .thum img

      클래스 속성으로

      border-radius: 10px;

      를 추가해주면 됩니다.

      마찬가지로 원하는 이미지 요소에 위처럼
      border-radius 속성을 부여하면 둥근 사각형 이미지를 만들 수 있습니다.

  • 사이드바 최근글 인기글은 안되네요 ㅠㅠ

    제가 잘못한걸까요?

    말씀 해주신대로 본문 사진은 수정하였습니다!

    감사합니다 :)

  • 안녕하세요 어포스트님.

    모바일에선 적용이 안되는데 요거 왜이럴까요?

    질문을 너무 많이 드리는것 같이 죄송합니다 ㅠㅠ

    • 기본 설정으로 적용된 것만 알려드려서 이런저럼 옵션을 켠 경우에 적용이 안되는걸 확인을 못했습니다.

      사이드바 썸네일은..

      .sidebar-thumbnail-on .recent-posts .thum img

      클래스에 추가로 속성을 줘야합니다.
      소스원본 기준으로는 style.css 779행이 됩니다.

      클래스 속성으로

      border-radius: 10px;

      를 추가해주시면 적용되어 보일겁니다.

      그리고

      사이드바 썸네일은..

      .sidebar-thumbnail-on .recent-posts .thum img

      클래스에 추가로 속성을 줘야합니다.
      소스원본 기준으로는 style.css 779행이 됩니다.

      클래스 속성으로

      border-radius: 10px;

      를 추가해주시면 적용되어 보일겁니다.

      그리고

      켜버페이지 하단에 커버리스트를 3개를 쓰면서 제목을 안넣으셔서 회색 두꺼운 줄이 나오고 있는데...
      제목을 안넣을 거면

      style.css 1238행
      또는
      .cover-list h2
      를 찾아서

      padding: 10px;
      background-color: #f6f6f6;

      속성 2개를 지우고
      border-bottom: 1px solid #e0e0e0;

      속성을 추가해주면

      커버리스트 3개가 하나처럼 붙어서 보이게 됩니다.


      상단 커버썸네일은 글내용 미리보기가 4번째 줄이 잘리는데.. 버그인인 것으로 보입니다. 스킨은 패치가 되어있습니다.

      style.css 993 행
      또는
      .cover-thumbnail-list ul li .excerpt
      를 검색해서

      line-height: 1.8;

      로 되어있는걸 1.7로 변경하면 잘리는 현상이 없어집니다.

  • 항상 자세한 답변 감사드립니다!
    오늘도 즐거운 하루 되셔요~!

  • 안녕하세요 어포스트님~ 항상 좋은 스킨 감사합니다.
    어포스트님이 제공해 주신 스킨 이것저것 쓰다가 결국엔 요 스킨으로 돌아왔네요.
    사이드바 질문차 댓글 드립니다.
    제가 카테고리를 사이드바에 넣어서 쓰고 있는데
    이 카테고리를 구분하는 선을 넣을수 있을까요?
    예를 들면

    게임리뷰
    -----------(직선)
    제품리뷰

    이런식으로요.

    항상 감사드리고 조언 부탁 드립니당!
    즐거운 하루 되셔요!

    • 사이드바 카테고리에 줄을 긋는걸 고려해서 행간 간격이 정해진게 아니라 모양을 예쁘게 잡자면 손댈대가 많아집니다.

      일단 모양만 엇비슷하게 잡자면

      스킨 원본 기준 style.css 546행
      .sidebar ul li ul li{
      속성에

      border-top: 1px dashed #ccc;

      이런식으로 점선을 주면 카테고리 사이에 점선이 그어져서 모양은 대충 맞게 됩니다.
      긴점선이 싫으면 dashed -> dotted 로 바꿔주면 됩니다.

      서브 카테고리 하단끝과 다음 카테고리명 사이에 여백이 있어서 간격이 벌어지는 것은

      543행의
      .sidebar ul li ul{

      margin-bottom 값을 줄이거나 없애면 됩니다.

      그리고 하위 카테고리 앞에 공백으로 들여쓰기한 것에 밑줄 점선이 있어서 모양이 썩 좋지 못한 것은

      549와 550행 사이에 새 클래스를 하나 추가로 정의합니다.

      .sidebar ul li ul li ul{
      margin-left: 20px;
      }

      그리고
      553행의
      .sidebar ul li ul li ul li a{
      속성인
      padding: 0 15px;

      padding: 0;
      으로 패딩을 없애서
      맞춰주면

      들여쓰기한 공백에 밑줄이 없어지게 됩니다.

  • 항상감사합니다!

  • 안녕하세요. 스킨 감사히 잘 쓰고 있습니다.
    한가지 질문이 있어서 문의 드립니다.

    https://seeit.kr/category/%EB%AC%B8%ED%99%94%20%EB%B0%94%EB%9D%BC%EB%B3%B4%EA%B8%B0/%EC%98%81%ED%99%94%20%EB%B0%94%EB%9D%BC%EB%B3%B4%EA%B8%B0?page=6

    카테고리를 클릭 ▶ 글 리스트에서 글 클릭하면
    URL 끝에 category 숫자가 URL로 붙게 되는데..
    그냥 URL 로 연결되도록 할 수 없나요?

    이유는
    https://seeit.kr/2088?category=465893
    이렇게 카테고리 주소가 붙은 URL로 접속하면 본문 상하단 영역에 애드센스 광고가 있는데 노출되지 않고
    https://seeit.kr/2088
    이렇게 카테고리를 지우고 접속하면 정상적으로 노출되기 때문입니다.

    스킨에 영향을 받는 것같은데,
    해결할 수 있는 방법이 있는지 확인 부탁 드립니다.

    감사합니다!

  • 안녕하세요 간만에 다시 질문할께 생겨서 들렸습니다

    사이드바에 광고를 넣어서 넣으면 만약 광고 밑에 공지사항을 넣었다고 할경우

    광고가 공지사항의 영역을 덮습니다

    이리 저리 해봐도 해결을 못하겠어서 질문드려요 ㅠㅠ 어떻게 해야 각각의 경계가 지켜질까요?

    광고를 넣을때는 사이드바에 html배너출력 플러그인을 이용해 넣었습니다

    • 2가지 방법이 가능합니다.
      제 블로그처럼 애드센스 최외과 태그(보통 <ins></ins> 태그)에 높이값을 줘서 크기를 고정시켜주는 방법과(보통 250px 추천)

      애드센스 태그 아래에
      <div style="clear:both"></div>
      태그를 추가해서 아래 오는 태그가 그 밑으로 표시되게 하거나

      하는 방법이 가능합니다.

      그리고 티스토리 플러그인으로 애드센스를 붙이는건 추천하지 않습니다.
      티스토리 플러그인의 경우 크기값이 강제로 붙기 때문에 css로 광고 크기값을 조정이 되지 않습니다.

      애드센스에서 제공하는 광고 코드를 사용하는 것을 추천합니다.

  • 감사합니다 해결 되었네요 역시 프로는 다릅니다 ㅎㅎ; 몇달전 부터 고민했던건데...


닫기