===== 1-1 Layout:圖與影片==== * [[wiki:dokuwiki|DokuWiki]]與語法[[wiki:syntax|Syntax]]{{fa>flask&align=right}} * 展示本站使用到的[[https://www.dokuwiki.org/plugins|Dokuwiki Plugins]]((Dokuwiki主程式為了維護其完整性，透過外掛Plugins與[[https://www.dokuwiki.org/template|模板Templates]]兩大類作為拓展功能用的Extensions，使用上依功能需要與喜愛的外觀來選擇，但須注意版本的相容性及延伸性。)) ==== Gallery ==== [[https://www.dokuwiki.org/plugin:gallery|plugin:gallery]]\\ * Gallery相簿外掛有完整的相簿功能，可以自訂相簿的單張大小與分頁中的縮圖數量 * 點進縮圖後，有lightbox的效果可以左右翻頁，按ESC可離開檢視，檢視尺寸也可以自訂 * 相較slider plugin看似更優，但限制是單頁最好僅使用一次，因為cache或是其他原因，第二組載入時有時僅顯示分頁按鈕，按下按鈕後縮圖才顯示(可正常顯示)；相較slider也有其缺點，但slider可以多組併用而無cache相互影響的問題。 * 結論與建議:同一頁想要展示多組相片時，可使用一組Gallery給數量多的相簿，Slider可多組適用數量少的相簿。ex.[[museum:tainan_art_museum|南美館]] {{gallery> :whereis?icctainan_*&200x200&1280X720&~4&2&showtitle&lightbox }} {{gallery> :whereis?icctainan_*&200x200&1280X720&~4&2&showtitle&lightbox }} [<10>] ==== slider plugin ==== [[https://www.dokuwiki.org/plugin:slider|plugin:slider]]\\ [經驗分享]有時瀏覽器顯示不正常(未完整顯示)時，在前後文插入<>(Wrap plugin)會有幫助，但非百分百。 ===== A Headline ===== And some other stuff 2 3 === A Headline === And some other stuff 2 3 城門旁書卷形建築為地球村英日語 ===東門城與東門圓環=== 幾乎來台南一定會經過的地標，下仁德交流道連接東門路入進市區，車速很自然的慢了下來，透露著已經進到了舊府城的範圍🦋 矗立在圓環內的東(迎春)門古蹟，本地人卻顯少親近，一是入口只圓環內靠南邊有個缺(入)口可以進入，二來除了夜間的燈光照明外僅有農曆春天的迎春儀式。🐌 往前上東門路橋跨過鐵路，充滿綠意，是東門圓環。多繞一圈，可發現放大的楊英風雕塑"青年雙手‧人類希望"。 東門城迎春門 ==== video share plugin ==== [[https://www.dokuwiki.org/plugin:vshare|plugin:vshare]] {{youtube>MCcBA_Hg0EU?large}} ==== Wrap圖 cf. imagebox plugin==== [[https://www.dokuwiki.org/plugin:wrap|plugin:wrap]]\\ 相較imgbox優點可以控制圖文框放置位置，外框以灰色區塊呈現；相對imgbox缺點內碼略多。 {{:whatsnew:tulips.jpg?direct&200|}}\\ 德元埤荷蘭日 {{:whatsnew:tulips.jpg?direct&200|}}\\ 德元埤荷蘭日 [[https://www.dokuwiki.org/plugin:imagebox|plugin:imagebox]]\\ 相較wrap的多功能之一，單一plugin可以通用地用單一語法為圖片顯示註解文字(annotation)(預設的dokuwiki是滑鼠滑到圖片上時顯示註解文字)，也可點選放大圖片(另開視窗)。 [{{:whatsnew:tulips.jpg?direct&200|德元埤荷蘭日1234567890}}] [{{:whatsnew:tulips.jpg?direct&200|德元埤荷蘭日1234567890}}] ==== SVG圖檔 ==== * 因為目前Dokuwiki系統預設並不支援(上傳後當成一般檔案)所以轉檔JPG/PNG後再使用是一種做法 * 早期Kenski在biz用第一種作法，多一道轉檔的工 * 另有人將SVG的XML碼貼入HTML標籤中顯示也是一種做法 * https://fontawesome.com/ 免費與付費的Font Awesome字體，包含單一SVG或HTML可下載 * https://www.svgrepo.com/ Open-licensed SVG Vector and Icons * 安裝[[https://www.dokuwiki.org/plugin%3Asvgembed|svgEmbed Plugin]]後並不是原生支援(當成IMG)而會以(OBJECT或EMBED)顯示 * 目前Kenski在tour的路標使用此法引用wikipedia的svg連結 ==== Unicode Emoji表情符號==== * Unicode的EMOJI 同於FB文章中常見的各種小圖符號 * [[wp>Unicode]]除了對各國文字的支援外，並把常用的動物、植物、標誌、交通、表情等放入 * [[https://fonts.google.com/|Google Fonts]]中有Noto Color Emoji字型(彩色/向量字型可以放大) * WEB輸入工具 //有分大類，如食物、動物...利用剪貼方式輸入// * https://tw.piliapp.com/emoji/in-blog/ * https://emoji.julien-marcou.fr/ * 安裝charpicker plugin替換掉不常用的希臘符號成EMOJI ^ ^ 0 ^ 1 ^ 2 ^ 3 ^ 4 ^ 5 ^ 6 ^ 7 ^ 8 ^ 9 ^ A ^ B ^ C ^ D ^ E ^ F ^ | U+1F3Dx | 🏐 | 🏑 | 🏒 | 🏓 | 🏔️ | 🏕️ | 🏖️ | 🏗️ | 🏘️ | 🏙️ | 🏚️ | 🏛️ | 🏜️ | 🏝️ | 🏞️ | 🏟️ | ==== imagemap ==== Plugin:[[https://www.dokuwiki.org/plugin:imapmarkers|Imapmarker]] * HTML時代使用Imagemap可以框圖片的區塊並賦予連結資訊，但僅嵌入html後的圖片沒有隨圖片大小自動調整的功能，也就是說當縮小圖片後圖片中的連結相對位置都不正確。 * 後來找到JQUERY有人寫外掛，但一直沒有成功用在Dokuwiki。後來再看一篇[[https://www.dokuwiki.org/faq:html|dokuwiki與html的FAQ]]寫道應該盡量用可用的外掛取代在dokuwiki中使用html，介紹到以imapmarker取代。 * 經過測試hogfather是可相容的(原寫Unknown)，所以成功解決台南市37分區圖。感謝作者Kai Thöne及相關協作者。 * **比imagemap多的**，語法可以產生文字連結，點擊會以圖標顯示圖片中的相對區塊。 {{imapmarkers>imapmarkers:1744_bowen_map_of_the_world.jpg|Bowen Map of the World, 1744}} [[https://en.wikipedia.org/wiki/Asia|CON1|Asia @ 456,116,30]] [[https://en.wikipedia.org/wiki/Africa|CON2|Africa @ 358,167,30]] [[wp>Australia|CON3|Australia @ 166,134,30]] {{cfg>}} { "marker" : "internal", "marker-color": "red", "clicked-reference-css": { "font-weight": "bold", "color": "red" }, "area-fillColor": "ff0000", "area-fillOpacity": 0.2 } {{CON1|Asia}} | {{imapmloc>CON2|Africa}} | {{imapmloc>CON3|North America}} | === Map 台南市行政區 === {{imapmarkers>geog:tnmap_by_tncg.jpg|台南37區圖市政府製}} [[https://www.tainan.com.tw/liuying/|CON1|柳營@330,162,399,204]] [[https://www.tainan.com.tw/annan/|CON2|安南區@95,435,175,495]] [[https://www.tainan.com.tw/zuozhen/|CON3|左鎮@391,459,444,495]] [[https://www.tainan.com.tw/south/|CON4|南區@174,550,211,587]] [[https://www.tainan.com.tw/anping/|CON5|安平區@121,523,172,557]] [[https://www.tainan.com.tw/yongkang/|CON6|永康@230,472,283,508]] [[https://www.tainan.com.tw/north/|CON7|北區@184,489,219,511]] [[https://www.tainan.com.tw/centerwest/|CON8|中西區@177,514,219,536]] [[https://www.tainan.com.tw/east/|CON9|東區@215,536,250,557]] [[https://www.tainan.com.tw/rende/|CON10|仁德@266,616,213,581]] [[https://www.tainan.com.tw/guiren/|CON11|歸仁@324,634,276,584]] [[https://www.tainan.com.tw/guanmiao/|CON12|關廟@375,571,314,535]] [[https://www.tainan.com.tw/longci/|CON13|龍崎@434,606,378,571]] [[https://www.tainan.com.tw/xinhua/|CON14|新化@317,465,380,503]] [[https://www.tainan.com.tw/qiqu/|CON15|七股@57,328,127,386]] [[https://www.tainan.com.tw/jiali/|CON16|佳里@148,300,200,321]] [[https://www.tainan.com.tw/xigang/|CON17|西港@165,351,220,377]] [[https://www.tainan.com.tw/anding/|CON18|安定@199,391,252,418]] [[https://www.tainan.com.tw/xinshi/|CON19|新市@274,404,338,441]] [[https://www.tainan.com.tw/shanhua/|CON20|善化@279,334,337,365]] [[https://www.tainan.com.tw/danei/|CON21|大內@377,340,430,373]] [[https://www.tainan.com.tw/shanshang/|CON22|山上@363,398,420,426]] [[https://www.tainan.com.tw/yujing/|CON24|玉井@449,364,509,409]] [[https://www.tainan.com.tw/nanhua/|CON25|南化@548,382,599,413]] [[https://www.tainan.com.tw/jiangjun/|CON26|將軍@86,252,138,281]] [[https://www.tainan.com.tw/madou/|CON27|麻豆@216,280,269,308]] [[https://www.tainan.com.tw/guantian/|CON28|官田@330,275,390,303]] [[https://www.tainan.com.tw/nanxi/|CON29|楠西@504,288,566,322]] [[https://www.tainan.com.tw/liujia/|CON30|六甲@390,236,449,261]] [[https://www.tainan.com.tw/xiaying/|CON31|下營@242,228,296,256]] [[https://www.tainan.com.tw/xuejia/|CON32|學甲@203,231,145,200]] [[https://www.tainan.com.tw/beimen/|CON33|北門@106,138,159,166]] [[https://www.tainan.com.tw/yanshui/|CON34|鹽水@214,149,269,176]] [[https://www.tainan.com.tw/xinying/|CON35|新營@290,118,346,148]] [[https://www.tainan.com.tw/dongshan/|CON37|東山@437,162,493,195]] [[https://www.tainan.com.tw/houbi/|CON36|後壁@333,61,394,94]] [[https://www.tainan.com.tw/baihe/|CON23|白河@453,81,515,122]] {{cfg>}} { "marker-color": "red", "clicked-reference-css": { "font-weight": "bold", "color": "red" }, "area-fillColor": "ff0000", "area-fillOpacity": 0.2 } {{map-pin}} {{imapmloc>CON31|CLICK!下營在哪裡}} ==== 其它==== * 如何更名rename媒體櫃中的檔名 * 靠後台如capable的檔案管理在data\media目錄下直接改檔名，缺點是內文的連結不會連動更正 * 使用move plugin在管理選單中，可進行頁面page及媒體櫃media的修改，並連動內文的連結 [<10>]