기본적으로 html을 알며, php가 어떤 것인지는 알아야 한다. 제로보드, 그누보드 를 설치해 보았다는 전제하에 이 글은 시작된다.
도쿠위키는 일단 ftp / 리눅스 / 퍼미션이니 하는 것들의 설정….
그 딴 거 없다. (하지만 ftp는 쓸 수 있어야 하고 알아야 한다. 편집자 본인은 오로지 alftp만 고집해왔던지라그거밖에 쓸 줄 몰ㄹ) 오히려 초보자들에게는 도움이 될 수 있지 않을까 싶다. 아울러 삽질 & 시간 낭비를 조금이라도 덜 하기를 바라면서)
alftp 다운로드 이제는 공식 다운로드도 막혀 버린 alftp이지만 그래도 나는 이게 젤 편하다.
여기서 최신버젼을 다운받아 압축 풀어서 걍 ftp로 업로드만 하고 경로로 접속만 하면 끝!!!
세상 간단하다. 물론 설치 전에 내가 쓰고 있는 호스팅서버(윈도우,리눅스 같은 운영체계에 설치해서 사용하는 것은 배제한다.)의 php 버젼(PHP는 버전 5.6 이상이어야 하지만 최신 버전을 적극 권장합니다.)
등은 확인해야 한다. 참조
모바일 홈페이지도 그냥 만들어진다. 그거 하나 만들어 보겠다고 XE에서나 요즘 유행하는 반응형 홈페이지 feat. wordpress / https://www.makenow.kr← 쉽고 빠르고 간편하게 반응형 홈페이지를 만들겠다면 이거 추천 / 따위를 열심히 기웃거렸던 나는 뭐지 ;;;
하지만 문제는 그 다음에 있으니~ ;;;
24.11.22. 기준 Hogfather 버젼이 최신 (안정된 것을 위해 나는 중간 버젼을 다운 받았다.) / 언어 선택은 걍 ko(한글)을 받아도 되는데 다 체크가 되어 있는 버젼을 받는다. (괜한 욕심) / 플러그인도 걍 다 체크해서 기본 포함이 되어 있는 것으로… (껴주는 옵션이 편리한거다. 본인은 혼자 쓰는 위키로 만들 것이니 맨 위에 capcha 는 뺀다.)
ftp의 경우 : 업로드 해주면 된다. 시간이 좀 걸리더라. (다른 일 보고 오기를 추천) / 도메인 경로로 접속하면 된다. 안 되면 install.php 붙여서 접속해보고, 폴더 권한설정 777로 해보고, 그래도 에러메시지나 페이지 없음 어쩌구 뜨면 내가 사용하고 있는 업체의 php 버젼을 확인하라~
테마 등을 바꾸기 위해서는 ./conf/dokuwiki.php
이 파일을 수정해야 한다.
/* Basic Settings */ $conf['title'] = 'DokuWiki'; //what to show in the title $conf['start'] = 'start'; //name of start page $conf['lang'] = 'ko'; //your language $conf['template'] = 'white'; //see lib/tpl directory $conf['tagline'] = ''; //tagline in header (if template supports it) $conf['sidebar'] = 'sidebar'; //name of sidebar in root namespace (if template supports it) $conf['license'] = 'cc-by-nc-sa'; //see conf/license.php $conf['savedir'] = './data'; //where to store all the files $conf['basedir'] = ''; //absolute dir from serveroot - blank for autodetection $conf['baseurl'] = ''; //URL to server including protocol - blank for autodetect $conf['cookiedir'] = ''; //path to use in cookies - blank for basedir $conf['dmode'] = 0755; //set directory creation mode $conf['fmode'] = 0644; //set file creation mode $conf['allowdebug'] = 0; //allow debug output, enable if needed 0|1
이렇게 수정해주었다.
어찌보면 가장 중요한 껍데기(스킨)에서의 핵심 파일이 바로 main.php
파일이다. 스킨을 적용해주고, 그 나머지 디자인과 기능들은 이 파일의 수정을 통해 지금 보고 있는 디자인이 모두 이루어진 것이다.
경로 : ./lib/tpl/white/main.php
<?php /** * DokuWiki NME Template * * @link http://nme.kr * @based on white template * @editor [email protected] * @license GPL 2 (http://www.gnu.org/licenses/gpl.html) */ if (!defined('DOKU_INC')) die(); @require_once(dirname(__FILE__).'/tpl_functions.php'); header('X-UA-Compatible: IE=edge,chrome=1'); $showSidebar = page_findnearest($conf['sidebar']); ?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $conf['lang'] ?>" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>" class="no-js"> <head> <!-- Google Tag Manager --> <script> (function(w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-WJ3T8KM'); </script> <!-- End Google Tag Manager --> <script type="text/javascript" src="view-source:http://usablica.github.io/widearea/widearea.js?v030"></script> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1.0, minimum-scale=1.0"> <meta name="description" content="nme.kr - name - 문학, 클래식, 어학, 여행회화, 상용구, 단문장사전, 어문학사전"> <meta property="og:type" content="website"> <meta property="og:title" content="nme.kr - name - 문학, 클래식, 어학, 여행회화, 상용구, 단문장사전, 어문학사전"> <meta property="og:description" content="nme.kr - name 원서로 읽기 위한, 문학, 클래식, 어학, 여행회화, 상용구, 단문장사전, 어문학사전"> <meta property="og:image" content="https://nme.kr/katoc.jpg"> <meta property="og:url" content="https://nme.kr"> <?php tpl_metaheaders() ?> <?php tpl_includeFile('meta.html') ?> <title><?php tpl_pagetitle() ?> [<?php echo strip_tags($conf['title']) ?>]</title> <script> (function(H) { H.className = H.className.replace(/\bno-js\b/, 'js') })(document.documentElement) </script> <?php echo tpl_favicon(array('favicon', 'mobile')) ?> <script> window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'UA-177213008-1'); </script> <!--- 구글 애드센스 스크립트 ---> <script data-ad-client="ca-pub-3614176458286759" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!--- 구글 애널리틱스 스크립트 ---> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-177213008-1"></script> <!--- 우측 광고 정렬 스크립트 ---> <style type="text/css" media="screen and (min-width:769px)"> #parent1 { position: relative; z-index: 3; } #child { position: absolute; display: none; z-index: 1; } </style> <style type="text/css"> #button { background: #FFF; } #button:hover { background: #F2F2F2; } </style> <link rel="stylesheet" type="text/css" href="/dw/lib/plugins/widearea/widearea/widearea.css" /> <script src="//developers.kakao.com/sdk/js/kakao.min.js"></script> </head> <body id="dokuwiki__top"> <div id="dokuwiki__site" class="<?php echo tpl_classes(); ?> <?php echo ($showSidebar) ? 'hasSidebar' : ''; ?>"> <?php html_msgarea() ?> <?php tpl_includeFile('header.html') ?> <div id="parent1"> <!-- ********** HEADER ********** --> <div id="dokuwiki__header"> <div class="group"> <h1><?php tpl_link(wl(),$conf['title'],'accesskey="h" title="[H]"') ?></h1> <div class="left"> <?php if ($showSidebar): ?> <button class="btn_left" accesskey="m" , title="[M]">Nav</button> <?php endif; ?> </div> <div class="right"> <button class="btn_search" accesskey="s" , title="[S]">Search</button> <button class="btn_right" accesskey="i" , title="[I]">Edit</button> </div> </div> <div class="search"> <?php tpl_searchform(); ?> </div> </div><!-- /header --> <!-- ********** sidebar ********** --> <div id="sidebar_wrapper"> <!-- ********** ASIDE ********** --> <?php if ($showSidebar): ?> <div id="dokuwiki__aside" class="sidebar"> <?php tpl_includeFile('sidebarheader.html') ?> <?php tpl_include_page($conf['sidebar'], 1, 1) ?> <?php tpl_includeFile('sidebarfooter.html') ?> <div id="button" style="font-size:12px; border: solid 1px; padding:5px; margin:5px; width:160px; height:30px;"> <img src="https://nme.kr/dw/lib/tpl/white/fold.png" align=middle><a href="javascript:void(0);" class="fold_unfold_all" onclick="fold_unfold_all();" rel="nofollow" title="Fold/unfold all"><span><b>전체 접힌 글 펴기 / 접기</b></span></a> </div> <!-- TOC --> <div id="sidebar" style="padding:5px; margin:5px;"> <?php tpl_toc()?> </div> </div><!-- /dokuwiki__aside --> <?php endif; ?> <div id="dokuwiki__tools" class="sidebar left"> <!-- PAGE TOOLS --> <div id="dokuwiki__pagetools"> <h3><?php echo $lang['page_tools'] ?></h3> <ul> <?php white_toolsevent('pagetools', array( 'edit' => tpl_action('edit', 1, 'li', 1, '<span>', '</span>'), 'revisions' => tpl_action('revisions', 1, 'li', 1, '<span>', '</span>'), 'backlink' => tpl_action('backlink', 1, 'li', 1, '<span>', '</span>'), 'subscribe' => tpl_action('subscribe', 1, 1, '<span>', '</span>'), 'revert' => tpl_action('revert', 1, 'li', 1, '<span>', '</span>'), )); ?> </ul> </div><!-- /dokuwiki__pagetools --> <!-- SITE TOOLS --> <div id="dokuwiki__sitetools"> <h3><?php echo $lang['site_tools'] ?></h3> <ul> <?php white_toolsevent('sitetools', array( 'recent' => tpl_action('recent', 1, 'li', 1, '<span>', '</span>'), 'media' => tpl_action('media', 1, 'li', 1, '<span>', '</span>'), 'index' => tpl_action('index', 1, 'li', 1, '<span>', '</span>'), )); ?> </ul> </div><!-- /dokuwiki__sitetools --> <!-- USER TOOLS --> <?php if ($conf['useacl']): ?> <div id="dokuwiki__usertools"> <h3><?php echo $lang['user_tools'] ?> </h3> <ul> <?php white_toolsevent('usertools', array( 'admin' => tpl_action('admin', 1, 'li', 1, '<span>', '</span>'), 'register' => tpl_action('register', 1, 'li', 1, '<span>', '</span>'), 'login' => tpl_action('login', 1, 'li', 1, '<span>', '</span>'), )); ?> </ul> <h3><a href="http://nme.kr/dw/doku.php?id=index&do=admin&page=move_tree">왼쪽 메뉴 편집</a> <p> <p> <a href="http://nme.kr/dw/doku.php?id=index&do=admin&page=extension"> Plugin 관리</a> <p> <a href="http://nme.kr/dw/doku.php?id=index&do=admin&page=styling"> 테마 디자인</a> </h3> <!-- Kakaotalk Share --> <div> </div> <center><input type="image" onClick="sendLinkCustom();" src="https://developers.kakao.com/assets/img/about/logos/kakaolink/kakaolink_btn_medium.png" width="25" height="25"> <b>카카오톡 링크 보내기</b></center> <script type="text/javascript"> function sendLinkCustom() { Kakao.init('e4dc9d94bcfd69949b12133b45c4d2cb'); Kakao.Link.sendCustom({ templateId: 75002 }); } </script> <script type='text/javascript'> //<![CDATA[ // // 사용할 앱의 JavaScript 키를 설정해 주세요. Kakao.init('e4dc9d94bcfd69949b12133b45c4d2cb'); // // 카카오링크 버튼을 생성합니다. 처음 한번만 호출하면 됩니다. Kakao.Link.createScrapButton({ container: '#kakao-link-btn', requestUrl: 'http://nme.kr', templateId : 75002 }); //]]> </script> </div><!-- /dokuwiki__usertools --> <?php endif ?> </div><!-- /dokuwiki__tools --> <div id="sidebar_bg"> </div> <div id="to_top"> <?php tpl_action('top') ?> </div> </div><!-- /sidebar_wrapper --> <div class="wrapper group"> <div style="border:1px solid lightgray;"> <!-- ********** CONTENT ********** --> <div id="dokuwiki__content"> <div class="group" id="parent1" style="background-color: #FFFFFF" style="height: 100%; width: 100%"> <?php tpl_flush() ?> <?php tpl_includeFile('pageheader.html') ?> <!-- BREADCRUMBS --> <?php if($conf['breadcrumbs']){ ?> <div class="breadcrumbs"><?php tpl_breadcrumbs($ret='›') ?></div> <?php } ?> <?php if($conf['youarehere']){ ?> <div class="breadcrumbs"><?php tpl_youarehere() ?></div> <?php } ?> <div class="page group <?php if(tpl_getConf('numberedHeading')): ?> numbered_heading<?php endif ?> <?php if(tpl_getConf('tocPosition')): ?> toc_<?php echo tpl_getConf('tocPosition') ?><?php endif ?> "> <!-- wikipage start --> <div> <?php tpl_content() ?> <!-- wikipage stop --> </div> <?php tpl_flush() ?> <?php tpl_includeFile('pagefooter.html') ?> </div> </div><!-- /content --> <a href="https://nme.kr"><img src="https://nme.kr/dw/logo.gif" border="0"></a> <!-- ********** FOOTER ********** --> <div id="dokuwiki__footer"> <?php if($INFO['exists']): ?> <div class="doc"><?php white_pageinfo() ?></div> <?php endif ?> <?php tpl_includeFile('sidebarfooter.html') ?> <?php tpl_license('badge', false, false) ?> <div class="footer"> <?php tpl_include_page(tpl_getConf('footer'), 1, 1) ?> </div> </div><!-- /footer --> <?php tpl_includeFile('ads.html') ?> </div><!-- /wrapper --> </div> </div><!-- /site --> <div class="no"><?php tpl_indexerWebBug() /* provide DokuWiki housekeeping, required in all templates */ ?></div> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WJ3T8KM" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <!-- Naver Analytics --> <script type="text/javascript" src="//wcs.naver.net/wcslog.js"></script> <script type="text/javascript"> if (!wcs_add) var wcs_add = {}; wcs_add["wa"] = "4b599b83947410"; if (window.wcs) { wcs_do(); } </script> <!-- End Naver Analytics --> </body> </html>
Friday:24.11.22 수정 백업
plugin 은 도쿠위키라고 하는 신차에 달리는 옵션이라고 할 수 있다. 플러그인의 기능에 따라서는 스마트폰의 앱만큼이나 기능이 없는 기기에 날개를 달아준다고도 볼 수 있다. 하지만, 여기에도 무분별한 플러그인의 설치는 에러 메시지 출력을 보게 될 수 있으니 꼭 필요한 기능을 위주로, 내 도쿠위키 버젼과 호환성(되도록 너무 오래된 플러그인은 깔지 말자) 및 다른 플러그인 설치 및 충돌에 대한 설명을 잘 읽어보고 설치하자.
용법에 관해서는 논외의 플러그인을 통한 구문 문법에 정리를 해놓고 있다.
코드 :
{{<date>% A : % d. % m. % y}}> plugin:date 날짜 삽입 플러그인코드 :
{searchform}plugin:searchform 내부 검색이 필요해서 깔았는데 그닥 ;;플러그인 리스트 목록으로 되어 있는 전체 플러그인 리스트이다.
현재 이곳에 적용되어 있는 템플릿은 white 템플릿이다. template:white
한국사람이 제작했으며 (예제 스샷이 아이유이다~), 매우 깔끔하고 단순하며 그래서 모바일에 더더욱 이점이 있다. (하지만 데스크탑용에는 기능이 너무 없으며 단순해서 기능을 하나 추가하려면 무진장 애먹어야 한다.. ㅡㅡ;;;) 괜찮아, 는 모바일 최적화이니까 ;;;
모든 글의 데이터는 txt 파일로 저장되는 것이 도쿠위키의 특징이자, 장단점이다. (백업 복구가 간편하다)
폴더의 위치도 간단하다. ./data/pages
이곳에 저장된다.
wiki:위키문법 참조
24.11.22 현재 지금까지도 가장 애를 많이 먹고 있는 부분이다.앞으로도? ㅠㅠ
플러그인 plugin:indexmenu 이것을 사용해서 현재 왼쪽의 메뉴를 구성하고 있다. 도쿠위키에서 메뉴 구성은 좀 특이한데 좌측의 메뉴처럼 폴딩 - 트리 구조의 메뉴를 만드려면 플러그인을 통해서 구현할 수가 있다. (하지만 도쿠위키 처음 디자인만큼이나 기본으로 제공하는 것은 투박함 ;;;) 플러그인을 설치한 후, sidebar 라는 처음부터 만들어져 있던 페이지에 코드를 작성하면 그 페이지가 메뉴 페이지가 되는 형식이다. 메뉴 편집은 사이드바 페이지를 편집하면 된다. 어찌보면 매우 효율적인 시스템이긴 한데.. 원하는대로 구성하려면 쉽지가 않다. ㅜㅠ
아주 긴 싸움이었다. 목차….
./lib/tpl/white/main.php 수정 <!-- ********** sidebar ********** --> <div id="sidebar_wrapper"> <!-- ********** ASIDE ********** --> <?php if ($showSidebar): ?> <div id="dokuwiki__aside" class="sidebar"> <?php tpl_includeFile('sidebarheader.html') ?> <?php tpl_include_page($conf['sidebar'], 1, 1) ?> <?php tpl_includeFile('sidebarfooter.html') ?> <!-- TOC --> <div id="sidebar"> <?php tpl_toc()?> </div> </div> <!-- /dokuwiki__aside -->
lib/scripts/page.js
파일을 수정 dw_page.makeToggle('#dwtoc h3','#dwtoc > div',-1);
-1만 끝에 붙여서 수정했다.
이곳은 도쿠위키라는 위키사이트로 제작되었다. 도쿠위키는 영문이다. 젝일, 내가 영어를 더 공부하던가 해야지. 네이버에서는 검색하면 아이돌 글들만 딸려 나온다. 네이버 쓰렉~ 결국 구글링인데~ 구글 자동번역하면 코드 명령어까지 같이 번역된다. 아놔… 빵부스러기 ;;;
그리하야~ 길고 긴 오딧세이 여정을 거치게 된 결과물들이다. 한글로 된 도쿠위키 정보들이 참 귀하다. ㅡㅜ 설치는 쉽다. 참 쉽다. 하지만 플러그인이 없으면 옵션없는 깡통 차에 불과하고, 디자인은 테마를 쓰면 되는데 당최 수정이 어렵다. ㅡㅜ
편집에 참고한 문서들
interwiki tips:interwiki_shortcuts
# Each URL may contain one of these placeholders # {URL} is replaced by the URL encoded representation of the wikiname # this is the right thing to do in most cases # {NAME} this is replaced by the wikiname as given in the document # only mandatory encoded is done, urlencoding if the link # is an external URL, or encoding as a wikiname if it is an # internal link (begins with a colon) # {SCHEME} # {HOST} # {PORT} # {PATH} # {QUERY} these placeholders will be replaced with the appropriate part # of the link when parsed as a URL # If no placeholder is defined the urlencoded name is appended to the URL # To prevent losing your added InterWiki shortcuts after an upgrade, # you should add new ones to interwiki.local.conf nme http://nme.kr/dw/doku.php?id={NAME} doku https://www.dokuwiki.org/ namu https://namu.wiki/w/{NAME} wpko https://ko.wikipedia.org/wiki/{NAME} wp https://en.wikipedia.org/wiki/{NAME} ow https://openwiki.kr/home?do=search&id={NAME} go https://www.google.com/search?q={URL}&btnI=lucky # To support VoIP/SIP/TEL links callto callto://{NAME} tel tel:{NAME}
<?php /* * Dokuwiki's Main Configuration File - Local Settings * Auto-generated by config plugin * Run for user: nme * Date: Fri, 28 Aug 2020 01:53:15 +0900 */ $conf['title'] = 'nme.kr'; $conf['start'] = 'index'; $conf['lang'] = 'ko'; $conf['template'] = 'white'; $conf['license'] = 'cc-by-sa'; $conf['breadcrumbs'] = 5; $conf['youarehere'] = 1; $conf['fullpath'] = 1; $conf['showuseras'] = 'email'; $conf['tocminheads'] = '2'; $conf['maxtoclevel'] = '5'; $conf['maxseclevel'] = '5'; $conf['useacl'] = 1; $conf['superuser'] = '@admin'; $conf['disableactions'] = 'register'; $conf['htmlok'] = 1; $conf['target']['extern'] = '_blank'; $conf['defer_js'] = 0; $conf['plugin']['pagebuttons']['hideDelete'] = 1; $conf['plugin']['pagelist']['style'] = 'simplelist'; $conf['plugin']['pagelist']['showheader'] = 1; $conf['tpl']['white']['numberedHeading'] = 1; $conf['tpl']['white']['footer'] = 'pagefooter.html'; $conf['tpl']['bootstrap3']['socialShareProviders'] = 'facebook,linkedin,pinterest,whatsapp,reddit,twitter,telegram,yammer,google-plus'; $conf['plugin']['overlay']['admin'] = '0'; $conf['plugin']['overlay']['profile'] = '0'; $conf['plugin']['overlay']['recent'] = '0'; $conf['plugin']['overlay']['revisions'] = '0'; $conf['plugin']['overlay']['backlink'] = '0'; $conf['plugin']['overlay']['login'] = '0'; $conf['plugin']['overlay']['index'] = '0'; $conf['plugin']['overlay']['media'] = '0'; $conf['plugin']['overlay']['register'] = '0'; $conf['plugin']['overlay']['edit'] = '0'; $conf['tpl']['white']['socialShareProviders'] = 'facebook,linkedin,pinterest,whatsapp,reddit,twitter,telegram,yammer,google-plus'; $conf['tpl']['dokuwiki']['socialShareProviders'] = 'facebook,linkedin,pinterest,whatsapp,reddit,twitter,telegram,yammer,google-plus';
파일에서 $conf['target']['interwiki'] = '_blank';
추가하면 된다.$conf['target']['extern'] = '_blank';
여기에다 그냥 ['interwiki']넣었다가 홈페이지에서 아무것도 안 눌러지는 먹통현상이 발생했다. 쩝, 따로 한 줄 넣어주어야 한다.
./lib/images/interwiki
에 올렸는데 말이다. 인터위키를 사용하는데 맛들리니 이제 아이콘을 넣어 문서를 만들고 싶어졌다. 그래서 연구했다.
결과 - devel:smileys.conf 참조 / 현재 이곳에 적용된 아이콘은 아래와 같다.
- 코드 :f: 폴더 아이콘 추가
이미지 업로드 경로는 ./ lib/images/smileys
8-) icon_cool.gif 8-O icon_eek.gif 8-o icon_eek.gif :-( icon_sad.gif :-) icon_smile.gif =) icon_smile2.gif :-/ icon_doubt.gif :-\ icon_doubt2.gif :-? icon_confused.gif :-D icon_biggrin.gif :-P icon_razz.gif : -o icon_surprised.gif : -O icon_surprised.gif : -x icon_silenced.gif : -X icon_silenced.gif :-| icon_neutral.gif ;-) icon_wink.gif m (facepalm.gif ^ _ ^ icon_fun.gif :? : icon_question.gif :! : icon_exclaim.gif LOL icon_lol.gif FIXME fixme.gif DELETEME delete.gif :f: f.png
주소입력창에 아이콘을 넣었다. 익스플로러의 경우,
<link rel="shortcut icon" href="이미지경로">
./data/media
폴더와 ./lib/tpl/dokuwiki/images
폴더에 업로드 시켜주기만 하면 끝이다.도쿠위키_디렉터리_구조 ⇒ 이곳을 참고하시길