페이지작성시 ‘목차’를 만들어 링크 연결하기!
워드프레스로 페이지 작성시, 상단에 ‘목차’를 만들어서 어떠한 내용들이 있으며,
클릭하면 그 페이지로 가는 ‘목차’를 만들어 링크 연결하기 에 대한 내용입니다.
페이지의 코드를 편집해서 사용하면 좋을 듯합니다.
ChatGPT를 이용한 ‘목차’를 만들어 링크 연결하기! 코딩!
<style> /* 추가적인 스타일링을 위한 CSS 코드 */ body { font-family: Arial, sans-serif; margin: 0; padding: 0; } #toc { position: fixed; top: 50%; right: 0; transform: translateY(-50%); background-color: #f0f0f0; padding: 10px; border-left: 1px solid #ccc; z-index: 1000; /* 다른 내용 위에 표시되도록 설정 */ } #toc ul { list-style-type: none; padding: 0; } #toc ul li { margin-bottom: 10px; } #toc a { text-decoration: none; color: #333; } h2 { margin-top: 0; } hr { border: none; height: 2px; background-color: #ccc; margin: 20px 0; } </style> </head> <body> <div id=”toc”> <h2>목차</h2> <ul> <li><a href=”#spring”>봄</a></li> <li><a href=”#summer”>여름</a></li> <li><a href=”#autumn”>가을</a></li> <li><a href=”#winter”>겨울</a></li> </ul> </div> <h1>사계절</h1> <hr> <h2 id=”spring”>봄</h2> <p>봄에 대한 설명을 여기에 작성하세요.</p> <h3>꽃이 필 때</h3> <p>꽃이 필 때에 대한 내용을 여기에 작성하세요.</p> <h3>따뜻한 날씨</h3> <p>따뜻한 날씨에 대한 내용을 여기에 작성하세요.</p> <h3>나들이</h3> <p>나들이에 대한 내용을 여기에 작성하세요.</p> <h2 id=”summer”>여름</h2> <p>여름에 대한 설명을 여기에 작성하세요.</p> <h3>더운 날씨</h3> <p>더운 날씨에 대한 내용을 여기에 작성하세요.</p> <h3>바다 여행</h3> <p>바다 여행에 대한 내용을 여기에 작성하세요.</p> <h3>수영</h3> <p>수영에 대한 내용을 여기에 작성하세요.</p> <h2 id=”autumn”>가을</h2> <p>가을에 대한 설명을 여기에 작성하세요.</p> <h3>단풍 구경</h3> <p>단풍 구경에 대한 내용을 여기에 작성하세요.</p> <h3>가을 축제</h3> <p>가을 축제에 대한 내용을 여기에 작성하세요.</p> <h3>시원한 바람</h3> <p>시원한 바람에 대한 내용을 여기에 작성하세요.</p> <h2 id=”winter”>겨울</h2> <p>겨울에 대한 설명을 여기에 작성하세요.</p> <h3>눈</h3> <p>눈에 대한 내용을 여기에 작성하세요.</p> <h3>스키</h3> <p>스키에 대한 내용을 여기에 작성하세요.</p> <h3>눈썰매</h3> <p>눈썰매에 대한 내용을 여기에 작성하세요.</p> </body>
사계절
봄
봄에 대한 설명을 여기에 작성하세요.
꽃이 필 때
꽃이 필 때에 대한 내용을 여기에 작성하세요.
따뜻한 날씨
따뜻한 날씨에 대한 내용을 여기에 작성하세요.
나들이
나들이에 대한 내용을 여기에 작성하세요.
여름
여름에 대한 설명을 여기에 작성하세요.
더운 날씨
더운 날씨에 대한 내용을 여기에 작성하세요.
바다 여행
바다 여행에 대한 내용을 여기에 작성하세요.
수영
수영에 대한 내용을 여기에 작성하세요.
가을
가을에 대한 설명을 여기에 작성하세요.
단풍 구경
단풍 구경에 대한 내용을 여기에 작성하세요.
가을 축제
가을 축제에 대한 내용을 여기에 작성하세요.
시원한 바람
시원한 바람에 대한 내용을 여기에 작성하세요.
겨울
겨울에 대한 설명을 여기에 작성하세요.
눈
눈에 대한 내용을 여기에 작성하세요.
스키
스키에 대한 내용을 여기에 작성하세요.
눈썰매
눈썰매에 대한 내용을 여기에 작성하세요.
다양한 플러그인을 사용하는 목차 블록!
장문의 게시글을 작성할 때, 안에 내용들만 수정해서 사용해 보면 좋을꺼 같습니다.
더 이쁘고 깔끔한 목차들이 있는데, 그것들도 천천히 하나씩 익혀가면서 꾸며봅시다!
워드프레스 목차 만들기 2가지 방법 블로그!
https://m.blog.naver.com/buupgrade/223061200542
유튜브 – 검색엔진 최적화에 도움이 되는 목차 꼭 쓰세요!