작으나마 도움이 되길 바랍니다.
감사합니다. ^^

원래 크리스마스 선물로 준비했는데, 작업이 늦어졌답니다. ^^
새해 복 많이 받으세요.
감사합니다.

감사합니다.
연말 잘 보내시고, 새해 복 많이 받으시기 바랍니다. ^^

활용에 어려움이 없길 바랍니다.
감사합니다.

네~ 감사합니다.

아무리 그래도 최고까지는 아닐 거예요.
그래도 좋게 보아주시니 고마운 마음입니다. ^^
감사합니다.

사용하시는 데 어려움이 없으면 좋겠습니다.
감사합니다.

도움이 되길 바랍니다.
감사합니다.

사용에 어려움이 없길 바랍니다.
감사합니다.

미흡한 부분이 있지만, 사용에 어려움이 없길 바랍니다.
감사합니다.

부족함이 있지만, 잘 활용되길 바랍니다.
감사합니다.

네~ 무쏘님께서도 새해 복 많이 받으시기 바랍니다.
감사합니다. ^^

네~ 감사합니다.

사용에 어려움이 없길 바랍니다.
감사합니다.

네~ 감사합니다. ^^

도움이 된다니 다행이네요. ^^
감사합니다.

네~ 감사합니다.

테마 폴더 > skin > member > basic > login.skin.php 파일의 내용 중 일부를 아래와 같이 수정하세요.

변경 전:
<div class="min-h-screen sm:flex sm:flex-row mx-0 justify-center">

변경 후:
<div class="min-h-screen flex flex-row mx-0 justify-center">

잘 해결되길 바랍니다.

사용에 어려움이 없길 바랍니다. ^^

좋게 보아주셔서 감사합니다. ^^

부족함이 많아서 사용자분들의 이야기에 귀를 기울이게 되네요. ^^
격려의 말씀, 문제점에 대한 지적 등, 제가 참조해야 할 내용들이어서요.

영식님의 일상에도 항상 좋은 일들 가득하기 바랍니다.
감사합니다.

네~ 감사합니다.

부디 도움이 되면 좋겠습니다.
감사합니다.

사용에 어려움이 없길 바랍니다.
감사합니다.

요즘 이런저런 작업을 하느라 정신이 좀 없네요.
잠시 짬을 내어 확인해 보았는데, 결과가 그리 좋지는 못합니다.
그래도 일단 말씀을 드리겠습니다.

1. 슬릭 슬라이더의 높이 조절은 몇 시간 이것, 저것 만져보았는데, 높이 조절은 쉽게 이루어지는 반면에 이미지의 위치를 중아으로 맞추는 것에는 좋은 결과를 얻지 못했습니다.
여러 자료를 잠조해가며 시도해 보았는데, 마음에 들지 않네요.
해서, 일단 높이 조절에 대해서만 말씀 드리겠습니다.

수정 전:
<div class="slider">

수정 후:
<div class="slider h-60 overflow-hidden">

위와 같이 h-60 정도면 250px 보다는 조금 작지만, 거의 근사치에 이르게 됩니다.
아니면, 다음과 같이 맞추셔도 될 것입니다.

<div class="slider overflow-hidden" style="height: 250px;>


2. 이 내용은 제가 지금 확인할 여력이 되지 않으니 양해 바랍니다.


3. 이 문제는 일단 mobile을 true가 아닌, false로 맞추시는 게 맞습니다.
반응형은 mobile을 무시해야 하며, 오직 접속 기기의 폭에 맞춰 자동으로 반응하게 해주셔야 합니다.

테마 소스를 수정하지 않은 상태에서 화면을 벗어나는 것은 아니지요?
현재 수정 이후의 상태에서 그런 증상이 나오는 것이라면, 이는 해당 소스를 살펴보기 전에는 확인할 방법이 없어 보입니다.

테마를 수정하지 않은 상태에서 확인해 보면, 아무 이상이 없어 보이거든요.
소스의 상태를 알지 못하는 상태에서는 그 무슨 말씀을 드리기 어렵다는 생각입니다.


시간적, 심적 여유가 없어 이 정도로 답글을 올리게 된 점, 양해 바랍니다.

이전에 말씀 드리진 못한 2번 문의글에 대한 답변글입니다.

최신글 스킨에서 다음과 같이 수정해 주시면 됩니다.

수정 전:
echo "<a href=\"" . get_pretty_url($bo_table, $list[$i]['wr_id']) . "\">";

수정 후:
echo "<a href=\"" . get_pretty_url($bo_table, $list[$i]['wr_id']) . "\" target='_blank'>";

답글이 늦었지만, 도움이 되면 좋겠습니다.

감사합니다.

부디 계획하신 용도에 잘 어울리게 되길 바랍니다.
감사합니다.

theme.css의 129 라인에 있는 아래의 CSS 속성을 주석 처리해 보세요.

.scrolled-offset {
  margin-top: 70px;
}

위의 속성을 추갛한 이유가 있었을 듯한데, 지금은 기억이 나질 않네요.
주석 처리 후에 별 다른 문제가 없어 보이니 한 번 시도해 보시기 바랍니다.

잘 헤결되었길 바랍니다. ^^

새창 설정 등은 css와 무관한 php 또는 HTML 등의 영역일 텐데, 무언가 문제가 있다는 게 잘 이해되지 않네요.
올려주신 내용만으로는 어떤 상황인지 알기가 어렵네요. 음~

알려주신 내용으로 증상을 이해했고, 이를 검토해서 원인을 찾아냈습니다.

head.php에서 다음과 같이 두 곳에 target 태그를 추가해 주세요.

- 수정전
<a href="<?php echo $row['me_link']; ?>"

<a href="<?php echo $row2['me_link']; ?>"


- 수정 후
<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>"

<a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"

하하6597 님 덕분에 문제점 하나를 수정하게 되었네요.
감사합니다. ^^

도움이 되었길 바랍니다.

좋게 보아주셔서 감사합니다.

사용하시는 데 어려움이 없길 바랍니다.

저의 아이폰에서 크롬으로 보면 아무 문제가 없는데, 왜 그런 증상이 나오는지 모르겠네요.
어쨌든, 문의하신 내용에 대해 말씀 드리겠습니다.

1. 로고의 크기 조절
- head.php의 라인 95에서 class를 추가하여 이미지의 사이즈를 조절하시면 됩니다.

- 수정 전
<a href="<?php echo G5_URL ?>" class="text-lg font-semibold tracking-widest text-indigo-900 uppercase rounded-lg dark-mode:text-white focus:outline-none focus:shadow-outline"><img src="<?php echo G5_THEME_IMG_URL ?>/logo.png" alt="<?php echo $config['cf_title']; ?>"></a>

- 수정 후
<a href="<?php echo G5_URL ?>" class="text-lg font-semibold tracking-widest text-indigo-900 uppercase rounded-lg dark-mode:text-white focus:outline-none focus:shadow-outline"><img src="<?php echo G5_THEME_IMG_URL ?>/logo.png" alt="<?php echo $config['cf_title']; ?>" class="h-6 md:h-auto"></a>

화면 폭이 md까지는 h-auto가 적용되어 일반 크기를 유지하고, md 이하로 줄어들면 높이를 h-6으로 조절하여 약간 작게 조절합니다.
여기에서 h 다음의 숫자를 조절하여 미세하게 조절하실 수 있고, md 대신 lg 등을 사용하여 더 넓은 폭에서 높이의 변화를 주실 수도 있으니, 이 두 가지 요소에 대해 원하는 설정을 해주시기 바랍니다.

2. 검색 아이콘을 최대한 오른쪽으로 붙게 하는 법
css > default.css에서 search-icon을 찾으셔서 left: 50%의 수치를 조절하세요.
숫자를 크게 하면 오른쪽으로 그만큼 이동하게 됩니다.
이 내용은 화면 폭이 1023px 보다 작은 경우에 동작하게 되므로, 원하시는 결과를 얻으실 수 있지 않을까 합니다.

그럼, 도움이 되길 바랍니다.

감사합니다.

최근 게시물의 경우는 일반 모드에서는 문제가 없으나, Dark 모드는 아직 작업하지 않은 관계로 일반 모드로 그대로 나와 좀 흉칙한 모양새가 나오게 되니 이점 양해해 주시기 바랍니다. ^^

일단 최신 게시물을 사용하시려면, 내려 받으신 테마 소스의 폴더에 있는 index.latest.php를 활용하시면 됩니다.

여기에서 두 가지 방법이 있으며, index 페이지 전체를 최신글 모음 위주로 꾸미는 방법과 현재의 페이지를 유지하면서 중간에 최신 게시글 소스를 삽입하여 화면 일부만 꾸미는 방법이 있습니다.

1. 화면 전체를 바꾸는 방법
- 먼저 현재의 index.php의 파일명을 다른 이름으로 임의로 변경
- 그 후에  index_latest.php의 파일명을 index.php로 변경
- 그런 후에 화면 고침을 하시면 최신글 위주로 구성한 메인 페이지를 보실 수 있습니다.

2. 화면 일부만 바꾸는 방법
-  index_latest에 있는 최신글 관련 코드만을 복사하여 현재의 index.php에 추가
- 이 경우에는 index_latest.php의 라인 75에서 시작하는 최신글 관련 코드 전체(즉, section 전체)를 복사해 넣을 수도 있고, 다음과 같이 일부만 추가하실 수도 있습니다.

<section class="latest_wr mt-12">
  <div class="container mx-auto sm: px-4 text-white relative">
    <h2 class="sound_only">최신글</h2>
    <div class="latest_top_wr grid grid-cols-1 md:grid-cols-2 gap-4 text-black">
      <div>
        <?php echo latest('theme/tail_basic', 'basic', 4, 23);  ?>
      </div>
      <div>
        <?php echo latest('theme/tail_basic', 'qa', 4, 23); ?>
      </div>
    </div>
    이 부분에 최신글 블록을 더 추가하실 수도 있습니다.
</div>

위에서 말씀 드린 최신글 블록이란 다음과 같은 구성을 의미합니다.
<div class="latest_top_wr grid grid-cols-1 md:grid-cols-2 gap-4 text-black">
  <div>
        <?php echo latest('theme/tail_pic_block', 'gallery', 4, 23); ?>
  </div>
    <div>
        <?php echo latest('theme/tail_pic_block', 'gallery', 4, 23); ?>
    </div>
 </div>

소스에도 각주로 내용이 적혀 있지만,
 latest(스킨, 게시판아이디, 출력라인, 글자수)와 같은 규칙 대로 적용하시면 됩니다.

좀 복잡하죠? ^^

이 정도가 제가 알려드릴 수 있는 내용의 전부가 아닐까 하며, 도움이 되길 바랍니다.

감사합니다.

좋게 보아주셔서 감사드립니다. ^^

작업이 원하시는 대로 원활하게 이루어지기 바랍니다.
감사합니다.

head.php의 코드에서 다음과 같이 수정하세요.

1.라인 101, 102, 127, 128
@click.away= 을 @mouseleave= 로 변경
@click= 을 @mouseover= 로 변경

2. 라인 109, 134
class="absolute right-0 w-full의 내용을 찾아 top-0 pt-8을 추가

마우스를 올렸을 때, 배경색이 바뀌는 동작에서 일부 이상을 보이기는 하는데, 이 부분은 아직 해결책을 찾지 못했으니 양해 바랍니다.

그리고, 위의 1의 내용을 라인 156에 있는 hamburger 메뉴에는 적용하지 않는 게 좋을 것으로 사료됩니다.

그럼, 원하시는 답글이면 좋겠네요.

감사합니다.

잘해결되어 다행입니다.
yo00님도 즐거운 주말 보내시기 바랍니다.

assests 폴더에 있는 theme.css 파일의 라인 169에 있습니다.

#main-top {
  margin-top: -35px;
  background: url("../img/main_01.jpg") top left;
  background-size: cover;
  height: 60vh;
}

위의 코드 중에서 url에 있는 주소가 이미지 파일의 경로입니다.

감사합니다.

잘 해결되어 다행이네요.
정확한 주소 입력이 중요한 관건이죠. ^^

감사합니다.

소스를 보시면, <div id='bo_v_img... 라는 코드가 있는데, 바로 그 위의 라인에 <div class='pt-4 pb-6'>... 라는 코드가 있습니다.
바로 이 위의 라인에서 pt-4의 숫자를 늘려주시면 본문이 시작되는 상단으로부터 첨부 이미지가 밑으로 떨어지게 되니, 이 부분의 수치를 올려보시기 바랍니다.
즉, pt-6, pt-8, pt-10, 또는 pt-12 등과 같이 수정하시면 될 것입니다.

css를 수정하셔도 되지만, tailwindcss 테마인 만큼, tailwindcss의 속성을 사용하시는 게 더 좋지 않을까 하는 생각입니다.

출처 표기를 하지 않으셔도 무관합니다.
마음껏, 재량껏 사용하시기 바랍니다.
잘 활용해 주신다면, 그로써 만족할 뿐입니다. ^^

어느 부분을 말씀하시는 건지 알 수 없어서 소스를 열심히 확인해보니, 아마도 푸터 부분을 말씀하시는 듯하네요.
그리고 미리 말씀 드리면, 일반 모드와 Dark Mode를 언제든 오가며 사용하기 위해 css에서 변수를 사용한 관계로 보통 때처럼 생각대로 적용이 되지 않는 게 정상입니다. ^^
orange나 sky 등의 변수는 설정한 게 없기 때문입니다.

일반 모드가 아닌 Dark mode까지 지원하기 위해서 색상과 관련하여 css에서 변수를 사용하여 인위적으로 설정하고 있어 생기는 현상입니다.
일반 모드에서 bg-indigo-500은 말 그대로 bg-indigo-500이 적용되지만, Dark Mode에서의 bg-indigo-500은 var(--bg-black-light)의 속성을 가지도록default.css에서 정의해 놓았으며, 따라서 default.css의 root에서 설정한 값인 --bg-black-light: #222;를 사용하도록 되어 있습니다.

default.css의 라인 176을 보시면, 아래와 같은 설정이 있습니다.

body.dark #footer.text-white {
  color: var(--text-white);
}
body.dark #footer.bg-indigo-500 {
  background: var(--bg-black-light);
}

이는 Dark Mode에서 사용하는 설정 값입니다.
즉, 일반 모드에서는 bg-indigo-500이지만, Dark Mode에서는 bg-indigo-500이 css의 설정에 의해 var(--bg-black-light)라는 속성으로 변환됩니다.(푸터에서의 설정입니다.)

색상 변수는 default.css의 라인 3에서 아래와 같이 색상을 정의하고 있습니다.
:root {
  --text-indigo-500: #6366f1;

  --bg-white: #fff;
  --bg-white-light: #eee;
  --bg-black: #121212;
  --bg-black-light: #222;

  --text-black: #000;
  --text-black-light: #222;
  --text-white: #fff;
  --text-white-light: #ccc;

  --border-black-light: #444;
}

올려주신 글에서 언급한 bg-orange-500을 기준으로 수정한다면, 아래와 같이 진행하시면 되지 않을까 합니다.

우선, root 부분에 bg-orange-500에 해당하는 색상 값으로 정의를 하나 추가합니다.
--bg-orange: #f97316;

그런 후에 라인 179에 있는 내용을 아래와 같이 수정하세요.

- 수정 전
body.dark #footer.bg-indigo-500 {
  background: var(--bg-black-light);
}

- 수정 후
body.dark #footer.bg-indigo-500 {
  background: var(--bg-orange);
}

참고로, 위에서 제가 정의한 --bg-orange가 아닌, 다른 코드로 임의로 정의하셔도 상관이 없지만, root 부분과 하단에서 그 코드를 동일하게 사용하셔야 합니다.
즉, root에서 --abc라고 정의했으면, 아래의 코드에서도 var(--abc)로 사용하시면 됩니다.

정리하면, 일반 모드와 Dark Mode를 오갈 때, 수 많은 HTML 태그의 class 또는 style을 일일이 직접 변경하는 것은 무리가 있기에, 그 대안으로 css에서 일반 모드일 때와 Dark Mode일 때의 색상 값을 자동으로 변경하도록 하기 위해 색상 값을 정의하는 변수를 먼저 root 부분에 정의해 놓고, 그 다음에 Dark Mode인 경우에는, HTML 태그의 body에 dark라는 class를 추가하도록 하고, css에서 body.dark일 경우에는 색상을 그에 맞춰 변경하도록 하는 방식입니다.
그래서 default.css를 보시면 dark mode에 해당하는 색상 값 설정 부분에는 모두 body.dark라는 접두어가 붙어 있습니다.

한 줄 정리:
Dark Mode로 변경 -> <body class="dark">와 같이 body 태그의 class에 'dark'를 추가(자바스크립트를 사용) -> body의 class에 dark가 추가 되었기에 body.dark로 시작하는 css의 모든 설정 값이 자동으로 적용됨 -> 따라서 색상이 모두 변경됨

설명이 좀 장황하긴 한데, 개념을 잘 이해하시어 활용에 어려움이 없길 바랍니다.

감사합니다.

네~ 일반 모드에서는 클래스에 tailwindcss의 속성을 지정하면 바로 적용되는데, 다크모드에서는 css의 변수명을 기준으로 변화하기에 이런 현상이 발생하게 된답니다. ^^

테마 제작 시에는 항상 한정된 시간 내에서 급하게 작업하여 공개하다보니 미처 손을 대지 못하거나, 잘못 코딩된 부분이 있습니다.
완성도가 떨어진 상태에서 공개하는 듯해서 테마를 공개할 때마다 매번 신경이 쓰이네요.
그렇기에 이런 부분에 대하여 알려주시면, 저로선 당연히 보완 작업을 해야 하는 게 맞다는 생각이고, 테마 자체의 문제가 아닌 경우에도 테마 활용에 어려움을 겪으시는 분들에게 작은 도움이라도 드릴 수 있다면 그 또한 좋은 일이 아닐까 합니다.

그러니까 결국은 제 마음 편하고자 하는 일이 아닐까 합니다. ^^

감사합니다.

좋게 보아주셔서 감사합니다. ^^

지금 말씀 중인 내용은 테마 폴더의 head.php에서 수정하시면 됩니다.

1. 부메뉴가 없는 경우, 즉 드롭다운 메뉴가 없는 경우의 메인 메뉴
 <a href="<?php echo $row['me_link']; ?>" class="flex items-center px-3 py-1 mt-2 rounded-lg lg:mt-0 focus:text-indigo-500 hover:bg-indigo-200 focus:bg-indigo-200 focus:outline-none focus:shadow-outline">

2. 부메뉴가 있는 경우의 메인 메뉴
<button @click="open = !open" class="flex flex-row items-center w-full px-3 py-1 mt-2 text-left rounded-lg lg:w-auto lg:mt-0 focus:text-indigo-500 hover:bg-indigo-200 focus:bg-indigo-200 focus:outline-none focus:shadow-outline">

3. 부메뉴 부분
<a href="<?php echo $row2['me_link']; ?>" class="block px-4 py-1 rounded-lg hover:text-black focus:text-blxk hover:bg-indigo-200 focus:bg-indigo-200 focus:outline-none focus:shadow-outline">

위의 코드 중에서 마우스 오버 시의 배경색은 hover:bg-indigo-200, 클릭 시의 텍스트 색상은 focus:text-indigo-500이오니, 이 부분을 찾아서 원하는 색상 코드(Tailwind의 색상 코드)로 변경해 주시면 됩니다.

원하시는 대로 수정이 잘 이루어지길 바랍니다.

감사합니다.

테마 폴더 < css 폴더의 default.css에서 라인 360의 # GNU Default 하단에 있는 body {font-family... 에서 원하는 폰트로 설정하시면 됩니다.

nav의 height 애니메이션이라는 게 드롭다운 메뉴가 열릴 때의 transition 동작을 말씀하시는 것인지요?
그렇다면 tail.php에서 불러오는 alpine.js와관련이 있는 것인지도 모르겠네요.

head.ph를 보시면, x-data="{ open: false }" 등과 같은 코드가 있는데, 이런 코드는 tailwindcss와는 무관하며, alpine.js라는 일종의 라이브러리에서 제공하는 기능을 사용하는 코드입니다.

드롭다운에서의 애니메이션은 제가 따로 설정한 것이 없으며, alpine.js에서 지원하는 기능을 이용했기에 소스에서 따로 건드릴 부분은 없지 않을까 합니다.

정확하게 어떤 상태인지 올려주신 글만으로는 파악하기가 어렵고, height와 어떤 연관이 있는 것인지도 감을 잡기가 어렵네요.

증상을 정확하게 파악할 수 없어 문제의 원인을 유추하기에는 어려움이 있으며, 어떤 증상인지 감을 잡더라도 css만이 아닌 javascript와도 연관이 있어 보이는 증상일 듯해서 소스를 살펴보기 전에는 원인을 찾아내는 것이 쉽지 않아 보입니다.

alpine.js와 연관된 증상인지는 확신할 수 없지만, https://alpinejs.dev/ 로 접속하시면 alpine.js의 기능 및 설정 등에 내한 내용을 참조하실 수 있으니 한 번 살펴보셔도 좋을 듯합니다.

혹시 테마 파일이 원본 그대로의 상태인지요?
만약 일부 수정하신 상태라면, 수정 또는 추가하신 태그와의 간섭으로 인한 증상일 텐데, 그 내역을 알 수 없고, 정확하게 어떤 증상인지도 파악할 수 없어 도움을 드리기에는 어려움이 있음을 양해하여 주시면 고맙겠습니다.

어쩌면 head.php의 <header id="header" class="sticky...라는 부분이 있는데, 여기에서 사용한 sticky와 견롼이 있는지도 모르니, class에 사용한 sticky를 잠시 삭제한 상태에서는 어떤지 확인해 보시기 바랍니다.

명확한 답글을 올리지 못한 점, 다시 한 번 양해바랍니다.

이상 증상을 잘 해결하셨다니 다행입니다.
sticky 하나 때문에 이런 사단이 일어났네요. ^^

이렇듯 문제의 원인을 소상하게 알려주셔서 감사합니다.

dark mode로 고정하시려면, 아래와 같이 일부 수정하시면 될 듯합니다.

head.sub.php에서 아래와 같이 두 곳의 내용을 수정해 주세요.

1. body

- 수정 전
<body class="light" <?php echo isset($g5['body_script']) ? $g5['body_script'] : ''; ?>>

- 수정 후
<body class="dark" <?php echo isset($g5['body_script']) ? $g5['body_script'] : ''; ?>>


2. script

- 수정 전
  <script>
    const theme = localStorage.getItem('theme' || 'light')
    document.body.className = theme
  </script>

- t수정 후
  <script>
  const theme = 'dark'
  localStorage.setItem("theme", theme);
  document.body.className = theme
  </script>

만약 light mode에서 파란색(indigo 색상) 부분을 흰색으로 바꾸시려면, 색상 변경을 하고자 하는 부분의 소스를 일일이 찾아서 수정하셔야 합니다.
해당하는 부분의 코드 중에서 bg-indigo-xxx, text-indigo-xxx 등을 bg-white, text-white로 변경하시면 됩니다.

소스 수정 후에 사이트 전체를 꼼꼼하게 확인해 보지는 못했기에 제대로 적용되지 않는 부분이 있을지도 모르겠네요.

그럼, 도움이 되는 내용이었길 바랍니다.

감사합니다.

큰 문제 없이 해결된 듯해서 다행이네요. ^^
감사합니다.

아마 이것 외에도 미처 손을 대지 못한 부분이 여럿 있을 듯한데, 전혀 손을 대지 못하고 있네요. ^^

말씀하신 부분은 다음과 같이 css를 추가해 주세요.

테마 폴더 > skin > search > basic > style.css에 아래의 내용을 추가해 주시면 됩니다.

/* Dark Mode */
body.dark #sch_res_detail,
body.dark .search_board_result li {
background: var(--bg-black-light);
}
body.dark #sch_res_detail #gr_id.select,
body.dark #sch_res_ov,
body.dark .search_board_result .sch_word {
color: var(--text-black-light)
}
body.dark .search_board_result p,
body.dark .sch_wr button {
  color: var(--text-white-light)
}

그럼, 도움이 되는 내용이었길 바랍니다.

처음부터 깔끔하게 작업해서 공개해야 했는데, 그렇지 못해 송구스러운 마음입니다.
생각 외로 손 볼 곳이 많아 많이 지쳤었거든요. ^^
아무쪼록 테마 이용에 어려움이 없길 바랍니다.

감사합니다.