1 line
131 KiB
JSON
1 line
131 KiB
JSON
[{"id":0,"href":"/docs/example/","title":"Example Site","section":"Docs","content":" Introduction # Ferre hinnitibus erat accipitrem dixi Troiae tollens # Lorem markdownum, a quoque nutu est quodcumque mandasset veluti. Passim inportuna totidemque nympha fert; repetens pendent, poenarum guttura sed vacet non, mortali undas. Omnis pharetramque gramen portentificisque membris servatum novabis fallit de nubibus atque silvas mihi. Dixit repetitaque Quid; verrit longa; sententia mandat quascumque nescio solebat litore; noctes. Hostem haerentem circuit plenaque tamen.\nPedum ne indigenae finire invergens carpebat Velit posses summoque De fumos illa foret Est simul fameque tauri qua ad # Locum nullus nisi vomentes. Ab Persea sermone vela, miratur aratro; eandem Argolicas gener.\nMe sol # Nec dis certa fuit socer, Nonacria dies manet tacitaque sibi? Sucis est iactata Castrumque iudex, et iactato quoque terraeque es tandem et maternos vittis. Lumina litus bene poenamque animos callem ne tuas in leones illam dea cadunt genus, et pleno nunc in quod. Anumque crescentesque sanguinis progenies nuribus rustica tinguet. Pater omnes liquido creditis noctem.\nif (mirrored(icmp_dvd_pim, 3, smbMirroredHard) != lion(clickImportQueue,\rviralItunesBalancing, bankruptcy_file_pptp)) {\rfile += ip_cybercrime_suffix;\r}\rif (runtimeSmartRom == netMarketingWord) {\rvirusBalancingWin *= scriptPromptBespoke + raster(post_drive,\rwindowsSli);\rcd = address_hertz_trojan;\rsoap_ccd.pcbServerGigahertz(asp_hardware_isa, offlinePeopleware, nui);\r} else {\rmegabyte.api = modem_flowchart - web + syntaxHalftoneAddress;\r}\rif (3 \u0026lt; mebibyteNetworkAnimated) {\rpharming_regular_error *= jsp_ribbon + algorithm * recycleMediaKindle(\rdvrSyntax, cdma);\radf_sla *= hoverCropDrive;\rtemplateNtfs = -1 - vertical;\r} else {\rexpressionCompressionVariable.bootMulti = white_eup_javascript(\rtable_suffix);\rguidPpiPram.tracerouteLinux += rtfTerabyteQuicktime(1,\rmanagementRosetta(webcamActivex), 740874);\r}\rvar virusTweetSsl = nullGigo;\rTrepident sitimque # Sentiet et ferali errorem fessam, coercet superbus, Ascaniumque in pennis mediis; dolor? Vidit imi Aeacon perfida propositos adde, tua Somni Fluctibus errante lustrat non.\nTamen inde, vos videt e flammis Scythica parantem rupisque pectora umbras. Haec ficta canistris repercusso simul ego aris Dixit! Esse Fama trepidare hunc crescendo vigor ululasse vertice exspatiantur celer tepidique petita aversata oculis iussa est me ferro.\n"},{"id":1,"href":"/docs/example/table-of-contents/with-toc/","title":"With ToC","section":"Table of Contents","content":" Caput vino delphine in tamen vias # Cognita laeva illo fracta # Lorem markdownum pavent auras, surgit nunc cingentibus libet Laomedonque que est. Pastor An arbor filia foedat, ne fugit aliter, per. Helicona illas et callida neptem est Oresitrophos caput, dentibus est venit. Tenet reddite famuli praesentem fortibus, quaeque vis foret si frondes gelidos gravidae circumtulit inpulit armenta nativum.\nTe at cruciabere vides rubentis manebo Maturuit in praetemptat ruborem ignara postquam habitasse Subitarum supplevit quoque fontesque venabula spretis modo Montis tot est mali quasque gravis Quinquennem domus arsit ipse Pellem turis pugnabant locavit Natus quaerere # Pectora et sine mulcere, coniuge dum tincta incurvae. Quis iam; est dextra Peneosque, metuis a verba, primo. Illa sed colloque suis: magno: gramen, aera excutiunt concipit.\nPhrygiae petendo suisque extimuit, super, pars quod audet! Turba negarem. Fuerat attonitus; et dextra retinet sidera ulnas undas instimulat vacuae generis? Agnus dabat et ignotis dextera, sic tibi pacis feriente at mora euhoeque comites hostem vestras Phineus. Vultuque sanguine dominoque metuit risi fama vergit summaque meus clarissimus artesque tinguebat successor nominis cervice caelicolae.\nLimitibus misere sit # Aurea non fata repertis praerupit feruntur simul, meae hosti lentaque citius levibus, cum sede dixit, Phaethon texta. Albentibus summos multifidasque iungitur loquendi an pectore, mihi ursaque omnia adfata, aeno parvumque in animi perlucentes. Epytus agis ait vixque clamat ornum adversam spondet, quid sceptra ipsum est. Reseret nec; saeva suo passu debentia linguam terga et aures et cervix de ubera. Coercet gelidumque manus, doluit volvitur induta?\nEnim sua # Iuvenilior filia inlustre templa quidem herbis permittat trahens huic. In cruribus proceres sole crescitque fata, quos quos; merui maris se non tamen in, mea.\nGermana aves pignus tecta # Mortalia rudibusque caelum cognosceret tantum aquis redito felicior texit, nec, aris parvo acre. Me parum contulerant multi tenentem, gratissime suis; vultum tu occupat deficeret corpora, sonum. E Actaea inplevit Phinea concepit nomenque potest sanguine captam nulla et, in duxisses campis non; mercede. Dicere cur Leucothoen obitum?\nPostibus mittam est nubibus principium pluma, exsecratur facta et. Iunge Mnemonidas pallamque pars; vere restitit alis flumina quae quoque, est ignara infestus Pyrrha. Di ducis terris maculatum At sede praemia manes nullaque!\n"},{"id":2,"href":"/docs/example/table-of-contents/without-toc/","title":"Without ToC","section":"Table of Contents","content":" At me ipso nepotibus nunc celebratior genus # Tanto oblite # Lorem markdownum pectora novis patenti igne sua opus aurae feras materiaque illic demersit imago et aristas questaque posset. Vomit quoque suo inhaesuro clara. Esse cumque, per referri triste. Ut exponit solisque communis in tendens vincetis agisque iamque huic bene ante vetat omina Thebae rates. Aeacus servat admonitu concidit, ad resimas vultus et rugas vultu dignamque Siphnon.\nQuam iugulum regia simulacra, plus meruit humo pecorumque haesit, ab discedunt dixit: ritu pharetramque. Exul Laurenti orantem modo, per densum missisque labor manibus non colla unum, obiectat. Tu pervia collo, fessus quae Cretenque Myconon crate! Tegumenque quae invisi sudore per vocari quaque plus ventis fluidos. Nodo perque, fugisse pectora sorores.\nSumme promissa supple vadit lenius # Quibus largis latebris aethera versato est, ait sentiat faciemque. Aequata alis nec Caeneus exululat inclite corpus est, ire tibi ostendens et tibi. Rigent et vires dique possent lumina; eadem dixit poma funeribus paret et felix reddebant ventis utile lignum.\nRemansit notam Stygia feroxque Et dabit materna Vipereas Phrygiaeque umbram sollicito cruore conlucere suus Quarum Elis corniger Nec ieiunia dixit Vertitur mos ortu ramosam contudit dumque; placabat ac lumen. Coniunx Amoris spatium poenamque cavernis Thebae Pleiadasque ponunt, rapiare cum quae parum nimium rima.\nQuidem resupinus inducto solebat una facinus quae # Credulitas iniqua praepetibus paruit prospexit, voce poena, sub rupit sinuatur, quin suum ventorumque arcadiae priori. Soporiferam erat formamque, fecit, invergens, nymphae mutat fessas ait finge.\nBaculum mandataque ne addere capiti violentior Altera duas quam hoc ille tenues inquit Sicula sidereus latrantis domoque ratae polluit comites Possit oro clausura namque se nunc iuvenisque Faciem posuit Quodque cum ponunt novercae nata vestrae aratra Ite extrema Phrygiis, patre dentibus, tonso perculit, enim blanda, manibus fide quos caput armis, posse! Nocendo fas Alcyonae lacertis structa ferarum manus fulmen dubius, saxa caelum effuge extremis fixum tumor adfecit bella, potentes? Dum nec insidiosa tempora tegit spirarunt. Per lupi pars foliis, porreximus humum negant sunt subposuere Sidone steterant auro. Memoraverit sine: ferrum idem Orion caelum heres gerebat fixis?\n"},{"id":3,"href":"/posts/creating-a-new-theme/","title":"Creating a New Theme","section":"动态","content":" Introduction # This tutorial will show you how to create a simple theme in Hugo. I assume that you are familiar with HTML, the bash command line, and that you are comfortable using Markdown to format content. I\u0026rsquo;ll explain how Hugo uses templates and how you can organize your templates to create a theme. I won\u0026rsquo;t cover using CSS to style your theme.\nWe\u0026rsquo;ll start with creating a new site with a very basic template. Then we\u0026rsquo;ll add in a few pages and posts. With small variations on that, you will be able to create many different types of web sites.\nIn this tutorial, commands that you enter will start with the \u0026ldquo;$\u0026rdquo; prompt. The output will follow. Lines that start with \u0026ldquo;#\u0026rdquo; are comments that I\u0026rsquo;ve added to explain a point. When I show updates to a file, the \u0026ldquo;:wq\u0026rdquo; on the last line means to save the file.\nHere\u0026rsquo;s an example:\n## this is a comment\r$ echo this is a command\rthis is a command\r## edit the file\r$ vi foo.md\r+++\rdate = \u0026#34;2014-09-28\u0026#34;\rtitle = \u0026#34;creating a new theme\u0026#34;\r+++\rbah and humbug\r:wq\r## show it\r$ cat foo.md\r+++\rdate = \u0026#34;2014-09-28\u0026#34;\rtitle = \u0026#34;creating a new theme\u0026#34;\r+++\rbah and humbug\r$ Some Definitions # There are a few concepts that you need to understand before creating a theme.\nSkins # Skins are the files responsible for the look and feel of your site. It’s the CSS that controls colors and fonts, it’s the Javascript that determines actions and reactions. It’s also the rules that Hugo uses to transform your content into the HTML that the site will serve to visitors.\nYou have two ways to create a skin. The simplest way is to create it in the layouts/ directory. If you do, then you don’t have to worry about configuring Hugo to recognize it. The first place that Hugo will look for rules and files is in the layouts/ directory so it will always find the skin.\nYour second choice is to create it in a sub-directory of the themes/ directory. If you do, then you must always tell Hugo where to search for the skin. It’s extra work, though, so why bother with it?\nThe difference between creating a skin in layouts/ and creating it in themes/ is very subtle. A skin in layouts/ can’t be customized without updating the templates and static files that it is built from. A skin created in themes/, on the other hand, can be and that makes it easier for other people to use it.\nThe rest of this tutorial will call a skin created in the themes/ directory a theme.\nNote that you can use this tutorial to create a skin in the layouts/ directory if you wish to. The main difference will be that you won’t need to update the site’s configuration file to use a theme.\nThe Home Page # The home page, or landing page, is the first page that many visitors to a site see. It is the index.html file in the root directory of the web site. Since Hugo writes files to the public/ directory, our home page is public/index.html.\nSite Configuration File # When Hugo runs, it looks for a configuration file that contains settings that override default values for the entire site. The file can use TOML, YAML, or JSON. I prefer to use TOML for my configuration files. If you prefer to use JSON or YAML, you’ll need to translate my examples. You’ll also need to change the name of the file since Hugo uses the extension to determine how to process it.\nHugo translates Markdown files into HTML. By default, Hugo expects to find Markdown files in your content/ directory and template files in your themes/ directory. It will create HTML files in your public/ directory. You can change this by specifying alternate locations in the configuration file.\nContent # Content is stored in text files that contain two sections. The first section is the “front matter,” which is the meta-information on the content. The second section contains Markdown that will be converted to HTML.\nFront Matter # The front matter is information about the content. Like the configuration file, it can be written in TOML, YAML, or JSON. Unlike the configuration file, Hugo doesn’t use the file’s extension to know the format. It looks for markers to signal the type. TOML is surrounded by “+++”, YAML by “---”, and JSON is enclosed in curly braces. I prefer to use TOML, so you’ll need to translate my examples if you prefer YAML or JSON.\nThe information in the front matter is passed into the template before the content is rendered into HTML.\nMarkdown # Content is written in Markdown which makes it easier to create the content. Hugo runs the content through a Markdown engine to create the HTML which will be written to the output file.\nTemplate Files # Hugo uses template files to render content into HTML. Template files are a bridge between the content and presentation. Rules in the template define what content is published, where it\u0026rsquo;s published to, and how it will rendered to the HTML file. The template guides the presentation by specifying the style to use.\nThere are three types of templates: single, list, and partial. Each type takes a bit of content as input and transforms it based on the commands in the template.\nHugo uses its knowledge of the content to find the template file used to render the content. If it can’t find a template that is an exact match for the content, it will shift up a level and search from there. It will continue to do so until it finds a matching template or runs out of templates to try. If it can’t find a template, it will use the default template for the site.\nPlease note that you can use the front matter to influence Hugo’s choice of templates.\nSingle Template # A single template is used to render a single piece of content. For example, an article or post would be a single piece of content and use a single template.\nList Template # A list template renders a group of related content. That could be a summary of recent postings or all articles in a category. List templates can contain multiple groups.\nThe homepage template is a special type of list template. Hugo assumes that the home page of your site will act as the portal for the rest of the content in the site.\nPartial Template # A partial template is a template that can be included in other templates. Partial templates must be called using the “partial” template command. They are very handy for rolling up common behavior. For example, your site may have a banner that all pages use. Instead of copying the text of the banner into every single and list template, you could create a partial with the banner in it. That way if you decide to change the banner, you only have to change the partial template.\nCreate a New Site # Let\u0026rsquo;s use Hugo to create a new web site. I\u0026rsquo;m a Mac user, so I\u0026rsquo;ll create mine in my home directory, in the Sites folder. If you\u0026rsquo;re using Linux, you might have to create the folder first.\nThe \u0026ldquo;new site\u0026rdquo; command will create a skeleton of a site. It will give you the basic directory structure and a useable configuration file.\n$ hugo new site ~/Sites/zafta\r$ cd ~/Sites/zafta\r$ ls -l\rtotal 8\rdrwxr-xr-x 7 quoha staff 238 Sep 29 16:49 .\rdrwxr-xr-x 3 quoha staff 102 Sep 29 16:49 ..\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes\r-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static\r$ Take a look in the content/ directory to confirm that it is empty.\nThe other directories (archetypes/, layouts/, and static/) are used when customizing a theme. That\u0026rsquo;s a topic for a different tutorial, so please ignore them for now.\nGenerate the HTML For the New Site # Running the hugo command with no options will read all the available content and generate the HTML files. It will also copy all static files (that\u0026rsquo;s everything that\u0026rsquo;s not content). Since we have an empty site, it won\u0026rsquo;t do much, but it will do it very quickly.\n$ hugo --verbose\rINFO: 2014/09/29 Using config file: config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rWARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html]\rWARN: 2014/09/29 Unable to locate layout: [404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 2 ms\r$ The \u0026ldquo;--verbose\u0026rdquo; flag gives extra information that will be helpful when we build the template. Every line of the output that starts with \u0026ldquo;INFO:\u0026rdquo; or \u0026ldquo;WARN:\u0026rdquo; is present because we used that flag. The lines that start with \u0026ldquo;WARN:\u0026rdquo; are warning messages. We\u0026rsquo;ll go over them later.\nWe can verify that the command worked by looking at the directory again.\n$ ls -l\rtotal 8\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes\r-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts\rdrwxr-xr-x 4 quoha staff 136 Sep 29 17:02 public\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static\r$ See that new public/ directory? Hugo placed all generated content there. When you\u0026rsquo;re ready to publish your web site, that\u0026rsquo;s the place to start. For now, though, let\u0026rsquo;s just confirm that we have what we\u0026rsquo;d expect from a site with no content.\n$ ls -l public\rtotal 16\r-rw-r--r-- 1 quoha staff 416 Sep 29 17:02 index.xml\r-rw-r--r-- 1 quoha staff 262 Sep 29 17:02 sitemap.xml\r$ Hugo created two XML files, which is standard, but there are no HTML files.\nTest the New Site # Verify that you can run the built-in web server. It will dramatically shorten your development cycle if you do. Start it by running the \u0026ldquo;server\u0026rdquo; command. If it is successful, you will see output similar to the following:\n$ hugo server --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rWARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html]\rWARN: 2014/09/29 Unable to locate layout: [404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 2 ms\rServing pages from /Users/quoha/Sites/zafta/public\rWeb Server is available at http://localhost:1313\rPress Ctrl+C to stop Connect to the listed URL (it\u0026rsquo;s on the line that starts with \u0026ldquo;Web Server\u0026rdquo;). If everything is working correctly, you should get a page that shows the following:\nindex.xml\rsitemap.xml That\u0026rsquo;s a listing of your public/ directory. Hugo didn\u0026rsquo;t create a home page because our site has no content. When there\u0026rsquo;s no index.html file in a directory, the server lists the files in the directory, which is what you should see in your browser.\nLet’s go back and look at those warnings again.\nWARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html]\rWARN: 2014/09/29 Unable to locate layout: [404.html] That second warning is easier to explain. We haven’t created a template to be used to generate “page not found errors.” The 404 message is a topic for a separate tutorial.\nNow for the first warning. It is for the home page. You can tell because the first layout that it looked for was “index.html.” That’s only used by the home page.\nI like that the verbose flag causes Hugo to list the files that it\u0026rsquo;s searching for. For the home page, they are index.html, _default/list.html, and _default/single.html. There are some rules that we\u0026rsquo;ll cover later that explain the names and paths. For now, just remember that Hugo couldn\u0026rsquo;t find a template for the home page and it told you so.\nAt this point, you\u0026rsquo;ve got a working installation and site that we can build upon. All that’s left is to add some content and a theme to display it.\nCreate a New Theme # Hugo doesn\u0026rsquo;t ship with a default theme. There are a few available (I counted a dozen when I first installed Hugo) and Hugo comes with a command to create new themes.\nWe\u0026rsquo;re going to create a new theme called \u0026ldquo;zafta.\u0026rdquo; Since the goal of this tutorial is to show you how to fill out the files to pull in your content, the theme will not contain any CSS. In other words, ugly but functional.\nAll themes have opinions on content and layout. For example, Zafta uses \u0026ldquo;post\u0026rdquo; over \u0026ldquo;blog\u0026rdquo;. Strong opinions make for simpler templates but differing opinions make it tougher to use themes. When you build a theme, consider using the terms that other themes do.\nCreate a Skeleton # Use the hugo \u0026ldquo;new\u0026rdquo; command to create the skeleton of a theme. This creates the directory structure and places empty files for you to fill out.\n$ hugo new theme zafta\r$ ls -l\rtotal 8\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes\r-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts\rdrwxr-xr-x 4 quoha staff 136 Sep 29 17:02 public\rdrwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static\rdrwxr-xr-x 3 quoha staff 102 Sep 29 17:31 themes\r$ find themes -type f | xargs ls -l\r-rw-r--r-- 1 quoha staff 1081 Sep 29 17:31 themes/zafta/LICENSE.md\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/archetypes/default.md\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/single.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/footer.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/header.html\r-rw-r--r-- 1 quoha staff 93 Sep 29 17:31 themes/zafta/theme.toml\r$ The skeleton includes templates (the files ending in .html), license file, a description of your theme (the theme.toml file), and an empty archetype.\nPlease take a minute to fill out the theme.toml and LICENSE.md files. They\u0026rsquo;re optional, but if you\u0026rsquo;re going to be distributing your theme, it tells the world who to praise (or blame). It\u0026rsquo;s also nice to declare the license so that people will know how they can use the theme.\n$ vi themes/zafta/theme.toml\rauthor = \u0026#34;michael d henderson\u0026#34;\rdescription = \u0026#34;a minimal working template\u0026#34;\rlicense = \u0026#34;MIT\u0026#34;\rname = \u0026#34;zafta\u0026#34;\rsource_repo = \u0026#34;\u0026#34;\rtags = [\u0026#34;tags\u0026#34;, \u0026#34;categories\u0026#34;]\r:wq\r## also edit themes/zafta/LICENSE.md and change\r## the bit that says \u0026#34;YOUR_NAME_HERE\u0026#34; Note that the the skeleton\u0026rsquo;s template files are empty. Don\u0026rsquo;t worry, we\u0026rsquo;ll be changing that shortly.\n$ find themes/zafta -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/single.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/footer.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/header.html\r$ Update the Configuration File to Use the Theme # Now that we\u0026rsquo;ve got a theme to work with, it\u0026rsquo;s a good idea to add the theme name to the configuration file. This is optional, because you can always add \u0026ldquo;-t zafta\u0026rdquo; on all your commands. I like to put it the configuration file because I like shorter command lines. If you don\u0026rsquo;t put it in the configuration file or specify it on the command line, you won\u0026rsquo;t use the template that you\u0026rsquo;re expecting to.\nEdit the file to add the theme, add a title for the site, and specify that all of our content will use the TOML format.\n$ vi config.toml\rtheme = \u0026#34;zafta\u0026#34;\rbaseurl = \u0026#34;\u0026#34;\rlanguageCode = \u0026#34;en-us\u0026#34;\rtitle = \u0026#34;zafta - totally refreshing\u0026#34;\rMetaDataFormat = \u0026#34;toml\u0026#34;\r:wq\r$ Generate the Site # Now that we have an empty theme, let\u0026rsquo;s generate the site again.\n$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 2 ms\r$ Did you notice that the output is different? The warning message for the home page has disappeared and we have an additional information line saying that Hugo is syncing from the theme\u0026rsquo;s directory.\nLet\u0026rsquo;s check the public/ directory to see what Hugo\u0026rsquo;s created.\n$ ls -l public\rtotal 16\rdrwxr-xr-x 2 quoha staff 68 Sep 29 17:56 css\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:56 index.html\r-rw-r--r-- 1 quoha staff 407 Sep 29 17:56 index.xml\rdrwxr-xr-x 2 quoha staff 68 Sep 29 17:56 js\r-rw-r--r-- 1 quoha staff 243 Sep 29 17:56 sitemap.xml\r$ Notice four things:\nHugo created a home page. This is the file public/index.html. Hugo created a css/ directory. Hugo created a js/ directory. Hugo claimed that it created 0 pages. It created a file and copied over static files, but didn\u0026rsquo;t create any pages. That\u0026rsquo;s because it considers a \u0026ldquo;page\u0026rdquo; to be a file created directly from a content file. It doesn\u0026rsquo;t count things like the index.html files that it creates automatically. The Home Page # Hugo supports many different types of templates. The home page is special because it gets its own type of template and its own template file. The file, layouts/index.html, is used to generate the HTML for the home page. The Hugo documentation says that this is the only required template, but that depends. Hugo\u0026rsquo;s warning message shows that it looks for three different templates:\nWARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html] If it can\u0026rsquo;t find any of these, it completely skips creating the home page. We noticed that when we built the site without having a theme installed.\nWhen Hugo created our theme, it created an empty home page template. Now, when we build the site, Hugo finds the template and uses it to generate the HTML for the home page. Since the template file is empty, the HTML file is empty, too. If the template had any rules in it, then Hugo would have used them to generate the home page.\n$ find . -name index.html | xargs ls -l\r-rw-r--r-- 1 quoha staff 0 Sep 29 20:21 ./public/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 ./themes/zafta/layouts/index.html\r$ The Magic of Static # Hugo does two things when generating the site. It uses templates to transform content into HTML and it copies static files into the site. Unlike content, static files are not transformed. They are copied exactly as they are.\nHugo assumes that your site will use both CSS and JavaScript, so it creates directories in your theme to hold them. Remember opinions? Well, Hugo\u0026rsquo;s opinion is that you\u0026rsquo;ll store your CSS in a directory named css/ and your JavaScript in a directory named js/. If you don\u0026rsquo;t like that, you can change the directory names in your theme directory or even delete them completely. Hugo\u0026rsquo;s nice enough to offer its opinion, then behave nicely if you disagree.\n$ find themes/zafta -type d | xargs ls -ld\rdrwxr-xr-x 7 quoha staff 238 Sep 29 17:38 themes/zafta\rdrwxr-xr-x 3 quoha staff 102 Sep 29 17:31 themes/zafta/archetypes\rdrwxr-xr-x 5 quoha staff 170 Sep 29 17:31 themes/zafta/layouts\rdrwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/layouts/_default\rdrwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/layouts/partials\rdrwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/static\rdrwxr-xr-x 2 quoha staff 68 Sep 29 17:31 themes/zafta/static/css\rdrwxr-xr-x 2 quoha staff 68 Sep 29 17:31 themes/zafta/static/js\r$ The Theme Development Cycle # When you\u0026rsquo;re working on a theme, you will make changes in the theme\u0026rsquo;s directory, rebuild the site, and check your changes in the browser. Hugo makes this very easy:\nPurge the public/ directory. Run the built in web server in watch mode. Open your site in a browser. Update the theme. Glance at your browser window to see changes. Return to step 4. I’ll throw in one more opinion: never work on a theme on a live site. Always work on a copy of your site. Make changes to your theme, test them, then copy them up to your site. For added safety, use a tool like Git to keep a revision history of your content and your theme. Believe me when I say that it is too easy to lose both your mind and your changes.\nCheck the main Hugo site for information on using Git with Hugo.\nPurge the public/ Directory # When generating the site, Hugo will create new files and update existing ones in the public/ directory. It will not delete files that are no longer used. For example, files that were created in the wrong directory or with the wrong title will remain. If you leave them, you might get confused by them later. I recommend cleaning out your site prior to generating it.\nNote: If you\u0026rsquo;re building on an SSD, you should ignore this. Churning on a SSD can be costly.\nHugo\u0026rsquo;s Watch Option # Hugo\u0026rsquo;s \u0026ldquo;--watch\u0026rdquo; option will monitor the content/ and your theme directories for changes and rebuild the site automatically.\nLive Reload # Hugo\u0026rsquo;s built in web server supports live reload. As pages are saved on the server, the browser is told to refresh the page. Usually, this happens faster than you can say, \u0026ldquo;Wow, that\u0026rsquo;s totally amazing.\u0026rdquo;\nDevelopment Commands # Use the following commands as the basis for your workflow.\n## purge old files. hugo will recreate the public directory.\r##\r$ rm -rf public\r##\r## run hugo in watch mode\r##\r$ hugo server --watch --verbose Here\u0026rsquo;s sample output showing Hugo detecting a change to the template for the home page. Once generated, the web browser automatically reloaded the page. I\u0026rsquo;ve said this before, it\u0026rsquo;s amazing.\n$ rm -rf public\r$ hugo server --watch --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 2 ms\rWatching for changes in /Users/quoha/Sites/zafta/content\rServing pages from /Users/quoha/Sites/zafta/public\rWeb Server is available at http://localhost:1313\rPress Ctrl+C to stop\rINFO: 2014/09/29 File System Event: [\u0026#34;/Users/quoha/Sites/zafta/themes/zafta/layouts/index.html\u0026#34;: MODIFY|ATTRIB]\rChange detected, rebuilding site\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 1 ms Update the Home Page Template # The home page is one of a few special pages that Hugo creates automatically. As mentioned earlier, it looks for one of three files in the theme\u0026rsquo;s layout/ directory:\nindex.html _default/list.html _default/single.html We could update one of the default templates, but a good design decision is to update the most specific template available. That\u0026rsquo;s not a hard and fast rule (in fact, we\u0026rsquo;ll break it a few times in this tutorial), but it is a good generalization.\nMake a Static Home Page # Right now, that page is empty because we don\u0026rsquo;t have any content and we don\u0026rsquo;t have any logic in the template. Let\u0026rsquo;s change that by adding some text to the template.\n$ vi themes/zafta/layouts/index.html\r\u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;hugo says hello!\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; :wq\r$ Build the web site and then verify the results.\n$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 0 pages created 0 tags created\r0 categories created\rin 2 ms\r$ find public -type f -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-r--r-- 1 quoha staff 78 Sep 29 21:26 public/index.html\r$ cat public/index.html \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;hugo says hello!\u0026lt;/p\u0026gt; \u0026lt;/html\u0026gt; Live Reload # Note: If you\u0026rsquo;re running the server with the --watch option, you\u0026rsquo;ll see different content in the file:\n$ cat public/index.html \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;hugo says hello!\u0026lt;/p\u0026gt; \u0026lt;script\u0026gt;document.write(\u0026#39;\u0026lt;script src=\u0026#34;http://\u0026#39; + (location.host || \u0026#39;localhost\u0026#39;).split(\u0026#39;:\u0026#39;)[0] + \u0026#39;:1313/livereload.js?mindelay=10\u0026#34;\u0026gt;\u0026lt;/\u0026#39; + \u0026#39;script\u0026gt;\u0026#39;)\u0026lt;/script\u0026gt;\u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; When you use --watch, the Live Reload script is added by Hugo. Look for live reload in the documentation to see what it does and how to disable it.\nBuild a \u0026ldquo;Dynamic\u0026rdquo; Home Page # \u0026ldquo;Dynamic home page?\u0026rdquo; Hugo\u0026rsquo;s a static web site generator, so this seems an odd thing to say. I mean let\u0026rsquo;s have the home page automatically reflect the content in the site every time Hugo builds it. We\u0026rsquo;ll use iteration in the template to do that.\nCreate New Posts # Now that we have the home page generating static content, let\u0026rsquo;s add some content to the site. We\u0026rsquo;ll display these posts as a list on the home page and on their own page, too.\nHugo has a command to generate a skeleton post, just like it does for sites and themes.\n$ hugo --verbose new post/first.md\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 attempting to create post/first.md of post\rINFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/default.md\rERROR: 2014/09/29 Unable to Cast \u0026lt;nil\u0026gt; to map[string]interface{}\r$ That wasn\u0026rsquo;t very nice, was it?\nThe \u0026ldquo;new\u0026rdquo; command uses an archetype to create the post file. Hugo created an empty default archetype file, but that causes an error when there\u0026rsquo;s a theme. For me, the workaround was to create an archetypes file specifically for the post type.\n$ vi themes/zafta/archetypes/post.md\r+++\rDescription = \u0026#34;\u0026#34;\rTags = []\rCategories = []\r+++\r:wq\r$ find themes/zafta/archetypes -type f | xargs ls -l\r-rw-r--r-- 1 quoha staff 0 Sep 29 21:53 themes/zafta/archetypes/default.md\r-rw-r--r-- 1 quoha staff 51 Sep 29 21:54 themes/zafta/archetypes/post.md\r$ hugo --verbose new post/first.md\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 attempting to create post/first.md of post\rINFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/post.md\rINFO: 2014/09/29 creating /Users/quoha/Sites/zafta/content/post/first.md\r/Users/quoha/Sites/zafta/content/post/first.md created\r$ hugo --verbose new post/second.md\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 attempting to create post/second.md of post\rINFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/post.md\rINFO: 2014/09/29 creating /Users/quoha/Sites/zafta/content/post/second.md\r/Users/quoha/Sites/zafta/content/post/second.md created\r$ ls -l content/post\rtotal 16\r-rw-r--r-- 1 quoha staff 104 Sep 29 21:54 first.md\r-rw-r--r-- 1 quoha staff 105 Sep 29 21:57 second.md\r$ cat content/post/first.md +++\rCategories = []\rDescription = \u0026#34;\u0026#34;\rTags = []\rdate = \u0026#34;2014-09-29T21:54:53-05:00\u0026#34;\rtitle = \u0026#34;first\u0026#34;\r+++\rmy first post\r$ cat content/post/second.md +++\rCategories = []\rDescription = \u0026#34;\u0026#34;\rTags = []\rdate = \u0026#34;2014-09-29T21:57:09-05:00\u0026#34;\rtitle = \u0026#34;second\u0026#34;\r+++\rmy second post\r$ Build the web site and then verify the results.\n$ rm -rf public\r$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 found taxonomies: map[string]string{\u0026#34;category\u0026#34;:\u0026#34;categories\u0026#34;, \u0026#34;tag\u0026#34;:\u0026#34;tags\u0026#34;}\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 2 pages created 0 tags created\r0 categories created\rin 4 ms\r$ The output says that it created 2 pages. Those are our new posts:\n$ find public -type f -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-r--r-- 1 quoha staff 78 Sep 29 22:13 public/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/first/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/second/index.html\r$ The new files are empty because because the templates used to generate the content are empty. The homepage doesn\u0026rsquo;t show the new content, either. We have to update the templates to add the posts.\nList and Single Templates # In Hugo, we have three major kinds of templates. There\u0026rsquo;s the home page template that we updated previously. It is used only by the home page. We also have \u0026ldquo;single\u0026rdquo; templates which are used to generate output for a single content file. We also have \u0026ldquo;list\u0026rdquo; templates that are used to group multiple pieces of content before generating output.\nGenerally speaking, list templates are named \u0026ldquo;list.html\u0026rdquo; and single templates are named \u0026ldquo;single.html.\u0026rdquo;\nThere are three other types of templates: partials, content views, and terms. We will not go into much detail on these.\nAdd Content to the Homepage # The home page will contain a list of posts. Let\u0026rsquo;s update its template to add the posts that we just created. The logic in the template will run every time we build the site.\n$ vi themes/zafta/layouts/index.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r{{ range first 10 .Data.Pages }}\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r{{ end }}\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r:wq\r$ Hugo uses the Go template engine. That engine scans the template files for commands which are enclosed between \u0026ldquo;{{\u0026rdquo; and \u0026ldquo;}}\u0026rdquo;. In our template, the commands are:\nrange .Title end The \u0026ldquo;range\u0026rdquo; command is an iterator. We\u0026rsquo;re going to use it to go through the first ten pages. Every HTML file that Hugo creates is treated as a page, so looping through the list of pages will look at every file that will be created.\nThe \u0026ldquo;.Title\u0026rdquo; command prints the value of the \u0026ldquo;title\u0026rdquo; variable. Hugo pulls it from the front matter in the Markdown file.\nThe \u0026ldquo;end\u0026rdquo; command signals the end of the range iterator. The engine loops back to the top of the iteration when it finds \u0026ldquo;end.\u0026rdquo; Everything between the \u0026ldquo;range\u0026rdquo; and \u0026ldquo;end\u0026rdquo; is evaluated every time the engine goes through the iteration. In this file, that would cause the title from the first ten pages to be output as heading level one.\nIt\u0026rsquo;s helpful to remember that some variables, like .Data, are created before any output files. Hugo loads every content file into the variable and then gives the template a chance to process before creating the HTML files.\nBuild the web site and then verify the results.\n$ rm -rf public\r$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 found taxonomies: map[string]string{\u0026#34;tag\u0026#34;:\u0026#34;tags\u0026#34;, \u0026#34;category\u0026#34;:\u0026#34;categories\u0026#34;}\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 2 pages created 0 tags created\r0 categories created\rin 4 ms\r$ find public -type f -name \u0026#39;*.html\u0026#39; | xargs ls -l -rw-r--r-- 1 quoha staff 94 Sep 29 22:23 public/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/first/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/second/index.html\r$ cat public/index.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;second\u0026lt;/h1\u0026gt;\r\u0026lt;h1\u0026gt;first\u0026lt;/h1\u0026gt;\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r$ Congratulations, the home page shows the title of the two posts. The posts themselves are still empty, but let\u0026rsquo;s take a moment to appreciate what we\u0026rsquo;ve done. Your template now generates output dynamically. Believe it or not, by inserting the range command inside of those curly braces, you\u0026rsquo;ve learned everything you need to know to build a theme. All that\u0026rsquo;s really left is understanding which template will be used to generate each content file and becoming familiar with the commands for the template engine.\nAnd, if that were entirely true, this tutorial would be much shorter. There are a few things to know that will make creating a new template much easier. Don\u0026rsquo;t worry, though, that\u0026rsquo;s all to come.\nAdd Content to the Posts # We\u0026rsquo;re working with posts, which are in the content/post/ directory. That means that their section is \u0026ldquo;post\u0026rdquo; (and if we don\u0026rsquo;t do something weird, their type is also \u0026ldquo;post\u0026rdquo;).\nHugo uses the section and type to find the template file for every piece of content. Hugo will first look for a template file that matches the section or type name. If it can\u0026rsquo;t find one, then it will look in the _default/ directory. There are some twists that we\u0026rsquo;ll cover when we get to categories and tags, but for now we can assume that Hugo will try post/single.html, then _default/single.html.\nNow that we know the search rule, let\u0026rsquo;s see what we actually have available:\n$ find themes/zafta -name single.html | xargs ls -l\r-rw-r--r-- 1 quoha staff 132 Sep 29 17:31 themes/zafta/layouts/_default/single.html We could create a new template, post/single.html, or change the default. Since we don\u0026rsquo;t know of any other content types, let\u0026rsquo;s start with updating the default.\nRemember, any content that we haven\u0026rsquo;t created a template for will end up using this template. That can be good or bad. Bad because I know that we\u0026rsquo;re going to be adding different types of content and we\u0026rsquo;re going to end up undoing some of the changes we\u0026rsquo;ve made. It\u0026rsquo;s good because we\u0026rsquo;ll be able to see immediate results. It\u0026rsquo;s also good to start here because we can start to build the basic layout for the site. As we add more content types, we\u0026rsquo;ll refactor this file and move logic around. Hugo makes that fairly painless, so we\u0026rsquo;ll accept the cost and proceed.\nPlease see the Hugo documentation on template rendering for all the details on determining which template to use. And, as the docs mention, if you\u0026rsquo;re building a single page application (SPA) web site, you can delete all of the other templates and work with just the default single page. That\u0026rsquo;s a refreshing amount of joy right there.\nUpdate the Template File # $ vi themes/zafta/layouts/_default/single.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;head\u0026gt;\r\u0026lt;title\u0026gt;{{ .Title }}\u0026lt;/title\u0026gt;\r\u0026lt;/head\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r{{ .Content }}\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r:wq\r$ Build the web site and verify the results.\n$ rm -rf public\r$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 found taxonomies: map[string]string{\u0026#34;tag\u0026#34;:\u0026#34;tags\u0026#34;, \u0026#34;category\u0026#34;:\u0026#34;categories\u0026#34;}\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 2 pages created 0 tags created\r0 categories created\rin 4 ms\r$ find public -type f -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-r--r-- 1 quoha staff 94 Sep 29 22:40 public/index.html\r-rw-r--r-- 1 quoha staff 125 Sep 29 22:40 public/post/first/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:40 public/post/index.html\r-rw-r--r-- 1 quoha staff 128 Sep 29 22:40 public/post/second/index.html\r$ cat public/post/first/index.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;head\u0026gt;\r\u0026lt;title\u0026gt;first\u0026lt;/title\u0026gt;\r\u0026lt;/head\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;first\u0026lt;/h1\u0026gt;\r\u0026lt;p\u0026gt;my first post\u0026lt;/p\u0026gt;\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r$ cat public/post/second/index.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;head\u0026gt;\r\u0026lt;title\u0026gt;second\u0026lt;/title\u0026gt;\r\u0026lt;/head\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;second\u0026lt;/h1\u0026gt;\r\u0026lt;p\u0026gt;my second post\u0026lt;/p\u0026gt;\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r$ Notice that the posts now have content. You can go to localhost:1313/post/first to verify.\nLinking to Content # The posts are on the home page. Let\u0026rsquo;s add a link from there to the post. Since this is the home page, we\u0026rsquo;ll update its template.\n$ vi themes/zafta/layouts/index.html\r\u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r{{ range first 10 .Data.Pages }}\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;{{ .Permalink }}\u0026#34;\u0026gt;{{ .Title }}\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r{{ end }}\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt; Build the web site and verify the results.\n$ rm -rf public\r$ hugo --verbose\rINFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/\rINFO: 2014/09/29 found taxonomies: map[string]string{\u0026#34;tag\u0026#34;:\u0026#34;tags\u0026#34;, \u0026#34;category\u0026#34;:\u0026#34;categories\u0026#34;}\rWARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html]\r0 draft content 0 future content 2 pages created 0 tags created\r0 categories created\rin 4 ms\r$ find public -type f -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-r--r-- 1 quoha staff 149 Sep 29 22:44 public/index.html\r-rw-r--r-- 1 quoha staff 125 Sep 29 22:44 public/post/first/index.html\r-rw-r--r-- 1 quoha staff 0 Sep 29 22:44 public/post/index.html\r-rw-r--r-- 1 quoha staff 128 Sep 29 22:44 public/post/second/index.html\r$ cat public/index.html \u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;/post/second/\u0026#34;\u0026gt;second\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;/post/first/\u0026#34;\u0026gt;first\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r$ Create a Post Listing # We have the posts displaying on the home page and on their own page. We also have a file public/post/index.html that is empty. Let\u0026rsquo;s make it show a list of all posts (not just the first ten).\nWe need to decide which template to update. This will be a listing, so it should be a list template. Let\u0026rsquo;s take a quick look and see which list templates are available.\n$ find themes/zafta -name list.html | xargs ls -l\r-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html As with the single post, we have to decide to update _default/list.html or create post/list.html. We still don\u0026rsquo;t have multiple content types, so let\u0026rsquo;s stay consistent and update the default list template.\nCreating Top Level Pages # Let\u0026rsquo;s add an \u0026ldquo;about\u0026rdquo; page and display it at the top level (as opposed to a sub-level like we did with posts).\nThe default in Hugo is to use the directory structure of the content/ directory to guide the location of the generated html in the public/ directory. Let\u0026rsquo;s verify that by creating an \u0026ldquo;about\u0026rdquo; page at the top level:\n$ vi content/about.md +++\rtitle = \u0026#34;about\u0026#34;\rdescription = \u0026#34;about this site\u0026#34;\rdate = \u0026#34;2014-09-27\u0026#34;\rslug = \u0026#34;about time\u0026#34;\r+++\r## about us\ri\u0026#39;m speechless\r:wq Generate the web site and verify the results.\n$ find public -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-rw-r-- 1 mdhender staff 334 Sep 27 15:08 public/about-time/index.html\r-rw-rw-r-- 1 mdhender staff 527 Sep 27 15:08 public/index.html\r-rw-rw-r-- 1 mdhender staff 358 Sep 27 15:08 public/post/first-post/index.html\r-rw-rw-r-- 1 mdhender staff 0 Sep 27 15:08 public/post/index.html\r-rw-rw-r-- 1 mdhender staff 342 Sep 27 15:08 public/post/second-post/index.html Notice that the page wasn\u0026rsquo;t created at the top level. It was created in a sub-directory named \u0026lsquo;about-time/\u0026rsquo;. That name came from our slug. Hugo will use the slug to name the generated content. It\u0026rsquo;s a reasonable default, by the way, but we can learn a few things by fighting it for this file.\nOne other thing. Take a look at the home page.\n$ cat public/index.html\r\u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;http://localhost:1313/post/theme/\u0026#34;\u0026gt;creating a new theme\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;http://localhost:1313/about-time/\u0026#34;\u0026gt;about\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;http://localhost:1313/post/second-post/\u0026#34;\u0026gt;second\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;h1\u0026gt;\u0026lt;a href=\u0026#34;http://localhost:1313/post/first-post/\u0026#34;\u0026gt;first\u0026lt;/a\u0026gt;\u0026lt;/h1\u0026gt;\r\u0026lt;script\u0026gt;document.write(\u0026#39;\u0026lt;script src=\u0026#34;http://\u0026#39;\r+ (location.host || \u0026#39;localhost\u0026#39;).split(\u0026#39;:\u0026#39;)[0]\r+ \u0026#39;:1313/livereload.js?mindelay=10\u0026#34;\u0026gt;\u0026lt;/\u0026#39;\r+ \u0026#39;script\u0026gt;\u0026#39;)\u0026lt;/script\u0026gt;\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt; Notice that the \u0026ldquo;about\u0026rdquo; link is listed with the posts? That\u0026rsquo;s not desirable, so let\u0026rsquo;s change that first.\n$ vi themes/zafta/layouts/index.html\r\u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;body\u0026gt;\r\u0026lt;h1\u0026gt;posts\u0026lt;/h1\u0026gt;\r{{ range first 10 .Data.Pages }}\r{{ if eq .Type \u0026#34;post\u0026#34;}}\r\u0026lt;h2\u0026gt;\u0026lt;a href=\u0026#34;{{ .Permalink }}\u0026#34;\u0026gt;{{ .Title }}\u0026lt;/a\u0026gt;\u0026lt;/h2\u0026gt;\r{{ end }}\r{{ end }}\r\u0026lt;h1\u0026gt;pages\u0026lt;/h1\u0026gt;\r{{ range .Data.Pages }}\r{{ if eq .Type \u0026#34;page\u0026#34; }}\r\u0026lt;h2\u0026gt;\u0026lt;a href=\u0026#34;{{ .Permalink }}\u0026#34;\u0026gt;{{ .Title }}\u0026lt;/a\u0026gt;\u0026lt;/h2\u0026gt;\r{{ end }}\r{{ end }}\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r:wq Generate the web site and verify the results. The home page has two sections, posts and pages, and each section has the right set of headings and links in it.\nBut, that about page still renders to about-time/index.html.\n$ find public -name \u0026#39;*.html\u0026#39; | xargs ls -l\r-rw-rw-r-- 1 mdhender staff 334 Sep 27 15:33 public/about-time/index.html\r-rw-rw-r-- 1 mdhender staff 645 Sep 27 15:33 public/index.html\r-rw-rw-r-- 1 mdhender staff 358 Sep 27 15:33 public/post/first-post/index.html\r-rw-rw-r-- 1 mdhender staff 0 Sep 27 15:33 public/post/index.html\r-rw-rw-r-- 1 mdhender staff 342 Sep 27 15:33 public/post/second-post/index.html Knowing that hugo is using the slug to generate the file name, the simplest solution is to change the slug. Let\u0026rsquo;s do it the hard way and change the permalink in the configuration file.\n$ vi config.toml\r[permalinks]\rpage = \u0026#34;/:title/\u0026#34;\rabout = \u0026#34;/:filename/\u0026#34; Generate the web site and verify that this didn\u0026rsquo;t work. Hugo lets \u0026ldquo;slug\u0026rdquo; or \u0026ldquo;URL\u0026rdquo; override the permalinks setting in the configuration file. Go ahead and comment out the slug in content/about.md, then generate the web site to get it to be created in the right place.\nSharing Templates # If you\u0026rsquo;ve been following along, you probably noticed that posts have titles in the browser and the home page doesn\u0026rsquo;t. That\u0026rsquo;s because we didn\u0026rsquo;t put the title in the home page\u0026rsquo;s template (layouts/index.html). That\u0026rsquo;s an easy thing to do, but let\u0026rsquo;s look at a different option.\nWe can put the common bits into a shared template that\u0026rsquo;s stored in the themes/zafta/layouts/partials/ directory.\nCreate the Header and Footer Partials # In Hugo, a partial is a sugar-coated template. Normally a template reference has a path specified. Partials are different. Hugo searches for them along a TODO defined search path. This makes it easier for end-users to override the theme\u0026rsquo;s presentation.\n$ vi themes/zafta/layouts/partials/header.html\r\u0026lt;!DOCTYPE html\u0026gt;\r\u0026lt;html\u0026gt;\r\u0026lt;head\u0026gt;\r\u0026lt;title\u0026gt;{{ .Title }}\u0026lt;/title\u0026gt;\r\u0026lt;/head\u0026gt;\r\u0026lt;body\u0026gt;\r:wq\r$ vi themes/zafta/layouts/partials/footer.html\r\u0026lt;/body\u0026gt;\r\u0026lt;/html\u0026gt;\r:wq Update the Home Page Template to Use the Partials # The most noticeable difference between a template call and a partials call is the lack of path:\n{{ template \u0026#34;theme/partials/header.html\u0026#34; . }} versus\n{{ partial \u0026#34;header.html\u0026#34; . }} Both pass in the context.\nLet\u0026rsquo;s change the home page template to use these new partials.\n$ vi themes/zafta/layouts/index.html\r{{ partial \u0026#34;header.html\u0026#34; . }}\r\u0026lt;h1\u0026gt;posts\u0026lt;/h1\u0026gt;\r{{ range first 10 .Data.Pages }}\r{{ if eq .Type \u0026#34;post\u0026#34;}}\r\u0026lt;h2\u0026gt;\u0026lt;a href=\u0026#34;{{ .Permalink }}\u0026#34;\u0026gt;{{ .Title }}\u0026lt;/a\u0026gt;\u0026lt;/h2\u0026gt;\r{{ end }}\r{{ end }}\r\u0026lt;h1\u0026gt;pages\u0026lt;/h1\u0026gt;\r{{ range .Data.Pages }}\r{{ if or (eq .Type \u0026#34;page\u0026#34;) (eq .Type \u0026#34;about\u0026#34;) }}\r\u0026lt;h2\u0026gt;\u0026lt;a href=\u0026#34;{{ .Permalink }}\u0026#34;\u0026gt;{{ .Type }} - {{ .Title }} - {{ .RelPermalink }}\u0026lt;/a\u0026gt;\u0026lt;/h2\u0026gt;\r{{ end }}\r{{ end }}\r{{ partial \u0026#34;footer.html\u0026#34; . }}\r:wq Generate the web site and verify the results. The title on the home page is now \u0026ldquo;your title here\u0026rdquo;, which comes from the \u0026ldquo;title\u0026rdquo; variable in the config.toml file.\nUpdate the Default Single Template to Use the Partials # $ vi themes/zafta/layouts/_default/single.html\r{{ partial \u0026#34;header.html\u0026#34; . }}\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r{{ .Content }}\r{{ partial \u0026#34;footer.html\u0026#34; . }}\r:wq Generate the web site and verify the results. The title on the posts and the about page should both reflect the value in the markdown file.\nAdd “Date Published” to Posts # It\u0026rsquo;s common to have posts display the date that they were written or published, so let\u0026rsquo;s add that. The front matter of our posts has a variable named \u0026ldquo;date.\u0026rdquo; It\u0026rsquo;s usually the date the content was created, but let\u0026rsquo;s pretend that\u0026rsquo;s the value we want to display.\nAdd “Date Published” to the Template # We\u0026rsquo;ll start by updating the template used to render the posts. The template code will look like:\n{{ .Date.Format \u0026#34;Mon, Jan 2, 2006\u0026#34; }} Posts use the default single template, so we\u0026rsquo;ll change that file.\n$ vi themes/zafta/layouts/_default/single.html\r{{ partial \u0026#34;header.html\u0026#34; . }}\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r\u0026lt;h2\u0026gt;{{ .Date.Format \u0026#34;Mon, Jan 2, 2006\u0026#34; }}\u0026lt;/h2\u0026gt;\r{{ .Content }}\r{{ partial \u0026#34;footer.html\u0026#34; . }}\r:wq Generate the web site and verify the results. The posts now have the date displayed in them. There\u0026rsquo;s a problem, though. The \u0026ldquo;about\u0026rdquo; page also has the date displayed.\nAs usual, there are a couple of ways to make the date display only on posts. We could do an \u0026ldquo;if\u0026rdquo; statement like we did on the home page. Another way would be to create a separate template for posts.\nThe \u0026ldquo;if\u0026rdquo; solution works for sites that have just a couple of content types. It aligns with the principle of \u0026ldquo;code for today,\u0026rdquo; too.\nLet\u0026rsquo;s assume, though, that we\u0026rsquo;ve made our site so complex that we feel we have to create a new template type. In Hugo-speak, we\u0026rsquo;re going to create a section template.\nLet\u0026rsquo;s restore the default single template before we forget.\n$ mkdir themes/zafta/layouts/post\r$ vi themes/zafta/layouts/_default/single.html\r{{ partial \u0026#34;header.html\u0026#34; . }}\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r{{ .Content }}\r{{ partial \u0026#34;footer.html\u0026#34; . }}\r:wq Now we\u0026rsquo;ll update the post\u0026rsquo;s version of the single template. If you remember Hugo\u0026rsquo;s rules, the template engine will use this version over the default.\n$ vi themes/zafta/layouts/post/single.html\r{{ partial \u0026#34;header.html\u0026#34; . }}\r\u0026lt;h1\u0026gt;{{ .Title }}\u0026lt;/h1\u0026gt;\r\u0026lt;h2\u0026gt;{{ .Date.Format \u0026#34;Mon, Jan 2, 2006\u0026#34; }}\u0026lt;/h2\u0026gt;\r{{ .Content }}\r{{ partial \u0026#34;footer.html\u0026#34; . }}\r:wq Note that we removed the date logic from the default template and put it in the post template. Generate the web site and verify the results. Posts have dates and the about page doesn\u0026rsquo;t.\nDon\u0026rsquo;t Repeat Yourself # DRY is a good design goal and Hugo does a great job supporting it. Part of the art of a good template is knowing when to add a new template and when to update an existing one. While you\u0026rsquo;re figuring that out, accept that you\u0026rsquo;ll be doing some refactoring. Hugo makes that easy and fast, so it\u0026rsquo;s okay to delay splitting up a template.\n"},{"id":4,"href":"/posts/migrate-from-jekyll/","title":"Migrating from Jekyll","section":"动态","content":" Move static content to static # Jekyll has a rule that any directory not starting with _ will be copied as-is to the _site output. Hugo keeps all static content under static. You should therefore move it all there. With Jekyll, something that looked like\n▾ \u0026lt;root\u0026gt;/\r▾ images/\rlogo.png\rshould become\n▾ \u0026lt;root\u0026gt;/\r▾ static/\r▾ images/\rlogo.png\rAdditionally, you\u0026rsquo;ll want any files that should reside at the root (such as CNAME) to be moved to static.\nCreate your Hugo configuration file # Hugo can read your configuration as JSON, YAML or TOML. Hugo supports parameters custom configuration too. Refer to the Hugo configuration documentation for details.\nSet your configuration publish folder to _site # The default is for Jekyll to publish to _site and for Hugo to publish to public. If, like me, you have _site mapped to a git submodule on the gh-pages branch, you\u0026rsquo;ll want to do one of two alternatives:\nChange your submodule to point to map gh-pages to public instead of _site (recommended).\ngit submodule deinit _site\rgit rm _site\rgit submodule add -b gh-pages git@github.com:your-username/your-repo.git public\rOr, change the Hugo configuration to use _site instead of public.\n{\r..\r\u0026quot;publishdir\u0026quot;: \u0026quot;_site\u0026quot;,\r..\r}\rConvert Jekyll templates to Hugo templates # That\u0026rsquo;s the bulk of the work right here. The documentation is your friend. You should refer to Jekyll\u0026rsquo;s template documentation if you need to refresh your memory on how you built your blog and Hugo\u0026rsquo;s template to learn Hugo\u0026rsquo;s way.\nAs a single reference data point, converting my templates for heyitsalex.net took me no more than a few hours.\nConvert Jekyll plugins to Hugo shortcodes # Jekyll has plugins; Hugo has shortcodes. It\u0026rsquo;s fairly trivial to do a port.\nImplementation # As an example, I was using a custom image_tag plugin to generate figures with caption when running Jekyll. As I read about shortcodes, I found Hugo had a nice built-in shortcode that does exactly the same thing.\nJekyll\u0026rsquo;s plugin:\nmodule Jekyll\rclass ImageTag \u0026lt; Liquid::Tag\r@url = nil\r@caption = nil\r@class = nil\r@link = nil\r// Patterns\rIMAGE_URL_WITH_CLASS_AND_CAPTION =\rIMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK = /(\\w+)(\\s+)((https?:\\/\\/|\\/)(\\S+))(\\s+)\u0026quot;(.*?)\u0026quot;(\\s+)-\u0026gt;((https?:\\/\\/|\\/)(\\S+))(\\s*)/i\rIMAGE_URL_WITH_CAPTION = /((https?:\\/\\/|\\/)(\\S+))(\\s+)\u0026quot;(.*?)\u0026quot;/i\rIMAGE_URL_WITH_CLASS = /(\\w+)(\\s+)((https?:\\/\\/|\\/)(\\S+))/i\rIMAGE_URL = /((https?:\\/\\/|\\/)(\\S+))/i\rdef initialize(tag_name, markup, tokens)\rsuper\rif markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK\r@class = $1\r@url = $3\r@caption = $7\r@link = $9\relsif markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION\r@class = $1\r@url = $3\r@caption = $7\relsif markup =~ IMAGE_URL_WITH_CAPTION\r@url = $1\r@caption = $5\relsif markup =~ IMAGE_URL_WITH_CLASS\r@class = $1\r@url = $3\relsif markup =~ IMAGE_URL\r@url = $1\rend\rend\rdef render(context)\rif @class\rsource = \u0026quot;\u0026lt;figure class='#{@class}'\u0026gt;\u0026quot;\relse\rsource = \u0026quot;\u0026lt;figure\u0026gt;\u0026quot;\rend\rif @link\rsource += \u0026quot;\u0026lt;a href=\\\u0026quot;#{@link}\\\u0026quot;\u0026gt;\u0026quot;\rend\rsource += \u0026quot;\u0026lt;img src=\\\u0026quot;#{@url}\\\u0026quot;\u0026gt;\u0026quot;\rif @link\rsource += \u0026quot;\u0026lt;/a\u0026gt;\u0026quot;\rend\rsource += \u0026quot;\u0026lt;figcaption\u0026gt;#{@caption}\u0026lt;/figcaption\u0026gt;\u0026quot; if @caption\rsource += \u0026quot;\u0026lt;/figure\u0026gt;\u0026quot;\rsource\rend\rend\rend\rLiquid::Template.register_tag('image', Jekyll::ImageTag)\ris written as this Hugo shortcode:\n\u0026lt;!-- image --\u0026gt;\r\u0026lt;figure {{ with .Get \u0026quot;class\u0026quot; }}class=\u0026quot;{{.}}\u0026quot;{{ end }}\u0026gt;\r{{ with .Get \u0026quot;link\u0026quot;}}\u0026lt;a href=\u0026quot;{{.}}\u0026quot;\u0026gt;{{ end }}\r\u0026lt;img src=\u0026quot;{{ .Get \u0026quot;src\u0026quot; }}\u0026quot; {{ if or (.Get \u0026quot;alt\u0026quot;) (.Get \u0026quot;caption\u0026quot;) }}alt=\u0026quot;{{ with .Get \u0026quot;alt\u0026quot;}}{{.}}{{else}}{{ .Get \u0026quot;caption\u0026quot; }}{{ end }}\u0026quot;{{ end }} /\u0026gt;\r{{ if .Get \u0026quot;link\u0026quot;}}\u0026lt;/a\u0026gt;{{ end }}\r{{ if or (or (.Get \u0026quot;title\u0026quot;) (.Get \u0026quot;caption\u0026quot;)) (.Get \u0026quot;attr\u0026quot;)}}\r\u0026lt;figcaption\u0026gt;{{ if isset .Params \u0026quot;title\u0026quot; }}\r{{ .Get \u0026quot;title\u0026quot; }}{{ end }}\r{{ if or (.Get \u0026quot;caption\u0026quot;) (.Get \u0026quot;attr\u0026quot;)}}\u0026lt;p\u0026gt;\r{{ .Get \u0026quot;caption\u0026quot; }}\r{{ with .Get \u0026quot;attrlink\u0026quot;}}\u0026lt;a href=\u0026quot;{{.}}\u0026quot;\u0026gt; {{ end }}\r{{ .Get \u0026quot;attr\u0026quot; }}\r{{ if .Get \u0026quot;attrlink\u0026quot;}}\u0026lt;/a\u0026gt; {{ end }}\r\u0026lt;/p\u0026gt; {{ end }}\r\u0026lt;/figcaption\u0026gt;\r{{ end }}\r\u0026lt;/figure\u0026gt;\r\u0026lt;!-- image --\u0026gt;\rUsage # I simply changed:\n{% image full http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg \u0026quot;One of my favorite touristy-type photos. I secretly waited for the good light while we were \u0026quot;having fun\u0026quot; and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing.\u0026quot; -\u0026gt;http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/ %}\rto this (this example uses a slightly extended version named fig, different than the built-in figure):\n{{% fig class=\u0026quot;full\u0026quot; src=\u0026quot;http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg\u0026quot; title=\u0026quot;One of my favorite touristy-type photos. I secretly waited for the good light while we were having fun and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing.\u0026quot; link=\u0026quot;http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/\u0026quot; %}}\rAs a bonus, the shortcode named parameters are, arguably, more readable.\nFinishing touches # Fix content # Depending on the amount of customization that was done with each post with Jekyll, this step will require more or less effort. There are no hard and fast rules here except that hugo server --watch is your friend. Test your changes and fix errors as needed.\nClean up # You\u0026rsquo;ll want to remove the Jekyll configuration at this point. If you have anything else that isn\u0026rsquo;t used, delete it.\nA practical example in a diff # Hey, it\u0026rsquo;s Alex was migrated in less than a father-with-kids day from Jekyll to Hugo. You can see all the changes (and screw-ups) by looking at this diff.\n"},{"id":5,"href":"/docs/example/table-of-contents/","title":"Table of Contents","section":"Example Site","content":" Ubi loqui # Mentem genus facietque salire tempus bracchia # Lorem markdownum partu paterno Achillem. Habent amne generosi aderant ad pellem nec erat sustinet merces columque haec et, dixit minus nutrit accipiam subibis subdidit. Temeraria servatum agros qui sed fulva facta. Primum ultima, dedit, suo quisque linguae medentes fixo: tum petis.\nRapit vocant si hunc siste adspice # Ora precari Patraeque Neptunia, dixit Danae Cithaeron armaque maxima in nati Coniugis templis fluidove. Effugit usus nec ingreditur agmen ac manus conlato. Nullis vagis nequiquam vultibus aliquos altera suum venis teneas fretum. Armos remotis hoc sine ferrea iuncta quam!\nLocus fuit caecis # Nefas discordemque domino montes numen tum humili nexilibusque exit, Iove. Quae miror esse, scelerisque Melaneus viribus. Miseri laurus. Hoc est proposita me ante aliquid, aura inponere candidioribus quidque accendit bella, sumpta. Intravit quam erat figentem hunc, motus de fontes parvo tempestate.\niscsi_virus = pitch(json_in_on(eupViral),\rnorthbridge_services_troubleshooting, personal(\rfirmware_rw.trash_rw_crm.device(interactive_gopher_personal,\rsoftware, -1), megabit, ergonomicsSoftware(cmyk_usb_panel,\rmips_whitelist_duplex, cpa)));\rif (5) {\rmanagementNetwork += dma - boolean;\rkilohertz_token = 2;\rhoneypot_affiliate_ergonomics = fiber;\r}\rmouseNorthbridge = byte(nybble_xmp_modem.horse_subnet(\ranalogThroughputService * graphicPoint, drop(daw_bit, dnsIntranet),\rgateway_ospf), repository.domain_key.mouse(serverData(fileNetwork,\rtrim_duplex_file), cellTapeDirect, token_tooltip_mashup(\rripcordingMashup)));\rmodule_it = honeypot_driver(client_cold_dvr(593902, ripping_frequency) +\rcoreLog.joystick(componentUdpLink), windows_expansion_touchscreen);\rbashGigabit.external.reality(2, server_hardware_codec.flops.ebookSampling(\rciscNavigationBacklink, table + cleanDriver), indexProtocolIsp);\rPlacabilis coactis nega ingemuit ignoscat nimia non # Frontis turba. Oculi gravis est Delphice; inque praedaque sanguine manu non.\nif (ad_api) {\rzif += usb.tiffAvatarRate(subnet, digital_rt) + exploitDrive;\rgigaflops(2 - bluetooth, edi_asp_memory.gopher(queryCursor, laptop),\rpanel_point_firmware);\rspyware_bash.statePopApplet = express_netbios_digital(\rinsertion_troubleshooting.brouter(recordFolderUs), 65);\r}\rrecursionCoreRay = -5;\rif (hub == non) {\rportBoxVirus = soundWeb(recursive_card(rwTechnologyLeopard),\rfont_radcab, guidCmsScalable + reciprocalMatrixPim);\rleft.bug = screenshot;\r} else {\rtooltipOpacity = raw_process_permalink(webcamFontUser, -1);\rexecutable_router += tape;\r}\rif (tft) {\rbandwidthWeb *= social_page;\r} else {\rregular += 611883;\rthumbnail /= system_lag_keyboard;\r}\rCaesorum illa tu sentit micat vestes papyriferi # Inde aderam facti; Theseus vis de tauri illa peream. Oculos uberaque non regisque vobis cursuque, opus venit quam vulnera. Et maiora necemque, lege modo; gestanda nitidi, vero? Dum ne pectoraque testantur.\nVenasque repulsa Samos qui, exspectatum eram animosque hinc, aut manes, Assyrii. Cupiens auctoribus pariter rubet, profana magni super nocens. Vos ius sibilat inpar turba visae iusto! Sedes ante dum superest extrema.\n"},{"id":6,"href":"/posts/goisforlovers/","title":"(Hu)go Template Primer","section":"动态","content":"Hugo uses the excellent Go html/template library for its template engine. It is an extremely lightweight engine that provides a very small amount of logic. In our experience that it is just the right amount of logic to be able to create a good static website. If you have used other template systems from different languages or frameworks you will find a lot of similarities in Go templates.\nThis document is a brief primer on using Go templates. The Go docs provide more details.\nIntroduction to Go Templates # Go templates provide an extremely simple template language. It adheres to the belief that only the most basic of logic belongs in the template or view layer. One consequence of this simplicity is that Go templates parse very quickly.\nA unique characteristic of Go templates is they are content aware. Variables and content will be sanitized depending on the context of where they are used. More details can be found in the Go docs.\nBasic Syntax # Golang templates are HTML files with the addition of variables and functions.\nGo variables and functions are accessible within {{ }}\nAccessing a predefined variable \u0026ldquo;foo\u0026rdquo;:\n{{ foo }}\rParameters are separated using spaces\nCalling the add function with input of 1, 2:\n{{ add 1 2 }}\rMethods and fields are accessed via dot notation\nAccessing the Page Parameter \u0026ldquo;bar\u0026rdquo;\n{{ .Params.bar }}\rParentheses can be used to group items together\n{{ if or (isset .Params \u0026quot;alt\u0026quot;) (isset .Params \u0026quot;caption\u0026quot;) }} Caption {{ end }}\rVariables # Each Go template has a struct (object) made available to it. In hugo each template is passed either a page or a node struct depending on which type of page you are rendering. More details are available on the variables page.\nA variable is accessed by referencing the variable name.\n\u0026lt;title\u0026gt;{{ .Title }}\u0026lt;/title\u0026gt;\rVariables can also be defined and referenced.\n{{ $address := \u0026quot;123 Main St.\u0026quot;}}\r{{ $address }}\rFunctions # Go template ship with a few functions which provide basic functionality. The Go template system also provides a mechanism for applications to extend the available functions with their own. Hugo template functions provide some additional functionality we believe are useful for building websites. Functions are called by using their name followed by the required parameters separated by spaces. Template functions cannot be added without recompiling hugo.\nExample:\n{{ add 1 2 }}\rIncludes # When including another template you will pass to it the data it will be able to access. To pass along the current context please remember to include a trailing dot. The templates location will always be starting at the /layout/ directory within Hugo.\nExample:\n{{ template \u0026quot;chrome/header.html\u0026quot; . }}\rLogic # Go templates provide the most basic iteration and conditional logic.\nIteration # Just like in Go, the Go templates make heavy use of range to iterate over a map, array or slice. The following are different examples of how to use range.\nExample 1: Using Context\n{{ range array }}\r{{ . }}\r{{ end }}\rExample 2: Declaring value variable name\n{{range $element := array}}\r{{ $element }}\r{{ end }}\rExample 2: Declaring key and value variable name\n{{range $index, $element := array}}\r{{ $index }}\r{{ $element }}\r{{ end }}\rConditionals # If, else, with, or, \u0026amp; and provide the framework for handling conditional logic in Go Templates. Like range, each statement is closed with end.\nGo Templates treat the following values as false:\nfalse 0 any array, slice, map, or string of length zero Example 1: If\n{{ if isset .Params \u0026quot;title\u0026quot; }}\u0026lt;h4\u0026gt;{{ index .Params \u0026quot;title\u0026quot; }}\u0026lt;/h4\u0026gt;{{ end }}\rExample 2: If -\u0026gt; Else\n{{ if isset .Params \u0026quot;alt\u0026quot; }}\r{{ index .Params \u0026quot;alt\u0026quot; }}\r{{else}}\r{{ index .Params \u0026quot;caption\u0026quot; }}\r{{ end }}\rExample 3: And \u0026amp; Or\n{{ if and (or (isset .Params \u0026quot;title\u0026quot;) (isset .Params \u0026quot;caption\u0026quot;)) (isset .Params \u0026quot;attr\u0026quot;)}}\rExample 4: With\nAn alternative way of writing \u0026ldquo;if\u0026rdquo; and then referencing the same value is to use \u0026ldquo;with\u0026rdquo; instead. With rebinds the context . within its scope, and skips the block if the variable is absent.\nThe first example above could be simplified as:\n{{ with .Params.title }}\u0026lt;h4\u0026gt;{{ . }}\u0026lt;/h4\u0026gt;{{ end }}\rExample 5: If -\u0026gt; Else If\n{{ if isset .Params \u0026quot;alt\u0026quot; }}\r{{ index .Params \u0026quot;alt\u0026quot; }}\r{{ else if isset .Params \u0026quot;caption\u0026quot; }}\r{{ index .Params \u0026quot;caption\u0026quot; }}\r{{ end }}\rPipes # One of the most powerful components of Go templates is the ability to stack actions one after another. This is done by using pipes. Borrowed from unix pipes, the concept is simple, each pipeline\u0026rsquo;s output becomes the input of the following pipe.\nBecause of the very simple syntax of Go templates, the pipe is essential to being able to chain together function calls. One limitation of the pipes is that they only can work with a single value and that value becomes the last parameter of the next pipeline.\nA few simple examples should help convey how to use the pipe.\nExample 1 :\n{{ if eq 1 1 }} Same {{ end }}\ris the same as\n{{ eq 1 1 | if }} Same {{ end }}\rIt does look odd to place the if at the end, but it does provide a good illustration of how to use the pipes.\nExample 2 :\n{{ index .Params \u0026quot;disqus_url\u0026quot; | html }}\rAccess the page parameter called \u0026ldquo;disqus_url\u0026rdquo; and escape the HTML.\nExample 3 :\n{{ if or (or (isset .Params \u0026quot;title\u0026quot;) (isset .Params \u0026quot;caption\u0026quot;)) (isset .Params \u0026quot;attr\u0026quot;)}}\rStuff Here\r{{ end }}\rCould be rewritten as\n{{ isset .Params \u0026quot;caption\u0026quot; | or isset .Params \u0026quot;title\u0026quot; | or isset .Params \u0026quot;attr\u0026quot; | if }}\rStuff Here\r{{ end }}\rContext (aka. the dot) # The most easily overlooked concept to understand about Go templates is that {{ . }} always refers to the current context. In the top level of your template this will be the data set made available to it. Inside of a iteration it will have the value of the current item. When inside of a loop the context has changed. . will no longer refer to the data available to the entire page. If you need to access this from within the loop you will likely want to set it to a variable instead of depending on the context.\nExample:\n{{ $title := .Site.Title }}\r{{ range .Params.tags }}\r\u0026lt;li\u0026gt; \u0026lt;a href=\u0026quot;{{ $baseurl }}/tags/{{ . | urlize }}\u0026quot;\u0026gt;{{ . }}\u0026lt;/a\u0026gt; - {{ $title }} \u0026lt;/li\u0026gt;\r{{ end }}\rNotice how once we have entered the loop the value of {{ . }} has changed. We have defined a variable outside of the loop so we have access to it from within the loop.\nHugo Parameters # Hugo provides the option of passing values to the template language through the site configuration (for sitewide values), or through the meta data of each specific piece of content. You can define any values of any type (supported by your front matter/config format) and use them however you want to inside of your templates.\nUsing Content (page) Parameters # In each piece of content you can provide variables to be used by the templates. This happens in the front matter.\nAn example of this is used in this documentation site. Most of the pages benefit from having the table of contents provided. Sometimes the TOC just doesn\u0026rsquo;t make a lot of sense. We\u0026rsquo;ve defined a variable in our front matter of some pages to turn off the TOC from being displayed.\nHere is the example front matter:\n---\rtitle: \u0026#34;Permalinks\u0026#34;\rdate: \u0026#34;2013-11-18\u0026#34;\raliases:\r- \u0026#34;/doc/permalinks/\u0026#34;\rgroups: [\u0026#34;extras\u0026#34;]\rgroups_weight: 30\rnotoc: true\r--- Here is the corresponding code inside of the template:\n{{ if not .Params.notoc }}\r\u0026lt;div id=\u0026quot;toc\u0026quot; class=\u0026quot;well col-md-4 col-sm-6\u0026quot;\u0026gt;\r{{ .TableOfContents }}\r\u0026lt;/div\u0026gt;\r{{ end }}\rUsing Site (config) Parameters # In your top-level configuration file (eg, config.yaml) you can define site parameters, which are values which will be available to you in chrome.\nFor instance, you might declare:\nparams: CopyrightHTML: \u0026#34;Copyright \u0026amp;#xA9; 2013 John Doe. All Rights Reserved.\u0026#34; TwitterUser: \u0026#34;spf13\u0026#34; SidebarRecentLimit: 5 Within a footer layout, you might then declare a \u0026lt;footer\u0026gt; which is only provided if the CopyrightHTML parameter is provided, and if it is given, you would declare it to be HTML-safe, so that the HTML entity is not escaped again. This would let you easily update just your top-level config file each January 1st, instead of hunting through your templates.\n{{if .Site.Params.CopyrightHTML}}\u0026lt;footer\u0026gt;\r\u0026lt;div class=\u0026#34;text-center\u0026#34;\u0026gt;{{.Site.Params.CopyrightHTML | safeHtml}}\u0026lt;/div\u0026gt;\r\u0026lt;/footer\u0026gt;{{end}} An alternative way of writing the \u0026ldquo;if\u0026rdquo; and then referencing the same value is to use \u0026ldquo;with\u0026rdquo; instead. With rebinds the context . within its scope, and skips the block if the variable is absent:\n{{with .Site.Params.TwitterUser}}\u0026lt;span class=\u0026#34;twitter\u0026#34;\u0026gt;\r\u0026lt;a href=\u0026#34;https://twitter.com/{{.}}\u0026#34; rel=\u0026#34;author\u0026#34;\u0026gt;\r\u0026lt;img src=\u0026#34;/images/twitter.png\u0026#34; width=\u0026#34;48\u0026#34; height=\u0026#34;48\u0026#34; title=\u0026#34;Twitter: {{.}}\u0026#34;\ralt=\u0026#34;Twitter\u0026#34;\u0026gt;\u0026lt;/a\u0026gt;\r\u0026lt;/span\u0026gt;{{end}} Finally, if you want to pull \u0026ldquo;magic constants\u0026rdquo; out of your layouts, you can do so, such as in this example:\n\u0026lt;nav class=\u0026#34;recent\u0026#34;\u0026gt;\r\u0026lt;h1\u0026gt;Recent Posts\u0026lt;/h1\u0026gt;\r\u0026lt;ul\u0026gt;{{range first .Site.Params.SidebarRecentLimit .Site.Recent}}\r\u0026lt;li\u0026gt;\u0026lt;a href=\u0026#34;{{.RelPermalink}}\u0026#34;\u0026gt;{{.Title}}\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\r{{end}}\u0026lt;/ul\u0026gt;\r\u0026lt;/nav\u0026gt; "},{"id":7,"href":"/posts/hugoisforlovers/","title":"Getting Started with Hugo","section":"动态","content":" Step 1. Install Hugo # Go to Hugo releases and download the appropriate version for your OS and architecture.\nSave it somewhere specific as we will be using it in the next step.\nMore complete instructions are available at Install Hugo\nStep 2. Build the Docs # Hugo has its own example site which happens to also be the documentation site you are reading right now.\nFollow the following steps:\nClone the Hugo repository Go into the repo Run hugo in server mode and build the docs Open your browser to http://localhost:1313 Corresponding pseudo commands:\ngit clone https://github.com/spf13/hugo\rcd hugo\r/path/to/where/you/installed/hugo server --source=./docs\r\u0026gt; 29 pages created\r\u0026gt; 0 tags index created\r\u0026gt; in 27 ms\r\u0026gt; Web Server is available at http://localhost:1313\r\u0026gt; Press ctrl+c to stop\rOnce you\u0026rsquo;ve gotten here, follow along the rest of this page on your local build.\nStep 3. Change the docs site # Stop the Hugo process by hitting Ctrl+C.\nNow we are going to run hugo again, but this time with hugo in watch mode.\n/path/to/hugo/from/step/1/hugo server --source=./docs --watch\r\u0026gt; 29 pages created\r\u0026gt; 0 tags index created\r\u0026gt; in 27 ms\r\u0026gt; Web Server is available at http://localhost:1313\r\u0026gt; Watching for changes in /Users/spf13/Code/hugo/docs/content\r\u0026gt; Press ctrl+c to stop\rOpen your favorite editor and change one of the source content pages. How about changing this very file to fix the typo. How about changing this very file to fix the typo.\nContent files are found in docs/content/. Unless otherwise specified, files are located at the same relative location as the url, in our case docs/content/overview/quickstart.md.\nChange and save this file.. Notice what happened in your terminal.\n\u0026gt; Change detected, rebuilding site\r\u0026gt; 29 pages created\r\u0026gt; 0 tags index created\r\u0026gt; in 26 ms\rRefresh the browser and observe that the typo is now fixed.\nNotice how quick that was. Try to refresh the site before it\u0026rsquo;s finished building. I double dare you. Having nearly instant feedback enables you to have your creativity flow without waiting for long builds.\nStep 4. Have fun # The best way to learn something is to play with it.\n"},{"id":8,"href":"/docs/example/collapsed/3rd-level/4th-level/","title":"4th Level","section":"3rd Level","content":" 4th Level of Menu # Caesorum illa tu sentit micat vestes papyriferi # Inde aderam facti; Theseus vis de tauri illa peream. Oculos uberaque non regisque vobis cursuque, opus venit quam vulnera. Et maiora necemque, lege modo; gestanda nitidi, vero? Dum ne pectoraque testantur.\nVenasque repulsa Samos qui, exspectatum eram animosque hinc, aut manes, Assyrii. Cupiens auctoribus pariter rubet, profana magni super nocens. Vos ius sibilat inpar turba visae iusto! Sedes ante dum superest extrema.\n"},{"id":9,"href":"/docs/example/collapsed/3rd-level/","title":"3rd Level","section":"Collapsed","content":" 3rd Level of Menu # Nefas discordemque domino montes numen tum humili nexilibusque exit, Iove. Quae miror esse, scelerisque Melaneus viribus. Miseri laurus. Hoc est proposita me ante aliquid, aura inponere candidioribus quidque accendit bella, sumpta. Intravit quam erat figentem hunc, motus de fontes parvo tempestate.\niscsi_virus = pitch(json_in_on(eupViral),\rnorthbridge_services_troubleshooting, personal(\rfirmware_rw.trash_rw_crm.device(interactive_gopher_personal,\rsoftware, -1), megabit, ergonomicsSoftware(cmyk_usb_panel,\rmips_whitelist_duplex, cpa)));\rif (5) {\rmanagementNetwork += dma - boolean;\rkilohertz_token = 2;\rhoneypot_affiliate_ergonomics = fiber;\r}\rmouseNorthbridge = byte(nybble_xmp_modem.horse_subnet(\ranalogThroughputService * graphicPoint, drop(daw_bit, dnsIntranet),\rgateway_ospf), repository.domain_key.mouse(serverData(fileNetwork,\rtrim_duplex_file), cellTapeDirect, token_tooltip_mashup(\rripcordingMashup)));\rmodule_it = honeypot_driver(client_cold_dvr(593902, ripping_frequency) +\rcoreLog.joystick(componentUdpLink), windows_expansion_touchscreen);\rbashGigabit.external.reality(2, server_hardware_codec.flops.ebookSampling(\rciscNavigationBacklink, table + cleanDriver), indexProtocolIsp);\r"},{"id":10,"href":"/docs/example/hidden/","title":"Hidden","section":"Example Site","content":" This page is hidden in menu # Quondam non pater est dignior ille Eurotas # Latent te facies # Lorem markdownum arma ignoscas vocavit quoque ille texit mandata mentis ultimus, frementes, qui in vel. Hippotades Peleus pennas conscia cuiquam Caeneus quas.\nPater demittere evincitque reddunt Maxime adhuc pressit huc Danaas quid freta Soror ego Luctus linguam saxa ultroque prior Tatiumque inquit Saepe liquitur subita superata dederat Anius sudor Cum honorum Latona # O fallor in sustinui iussorum equidem. Nymphae operi oris alii fronde parens dumque, in auro ait mox ingenti proxima iamdudum maius?\nreality(burnDocking(apache_nanometer),\rpad.property_data_programming.sectorBrowserPpga(dataMask, 37,\rrecycleRup));\rintellectualVaporwareUser += -5 * 4;\rtraceroute_key_upnp /= lag_optical(android.smb(thyristorTftp));\rsurge_host_golden = mca_compact_device(dual_dpi_opengl, 33,\rcommerce_add_ppc);\rif (lun_ipv) {\rverticalExtranet(1, thumbnail_ttl, 3);\rbar_graphics_jpeg(chipset - sector_xmp_beta);\r}\rFronde cetera dextrae sequens pennis voce muneris # Acta cretus diem restet utque; move integer, oscula non inspirat, noctisque scelus! Nantemque in suas vobis quamvis, et labori!\nvar runtimeDiskCompiler = home - array_ad_software;\rif (internic \u0026gt; disk) {\remoticonLockCron += 37 + bps - 4;\rwan_ansi_honeypot.cardGigaflops = artificialStorageCgi;\rsimplex -= downloadAccess;\r}\rvar volumeHardeningAndroid = pixel + tftp + onProcessorUnmount;\rsector(memory(firewire + interlaced, wired)); "},{"id":11,"href":"/docs/shortcodes/buttons/","title":"Buttons","section":"Shortcodes","content":" Buttons # Buttons are styled links that can lead to local page or external link.\nExample # {{\u0026lt; button relref=\u0026#34;/\u0026#34; [class=\u0026#34;...\u0026#34;] \u0026gt;}}Get Home{{\u0026lt; /button \u0026gt;}} {{\u0026lt; button href=\u0026#34;https://github.com/alex-shpak/hugo-book\u0026#34; \u0026gt;}}Contribute{{\u0026lt; /button \u0026gt;}} Get Home Contribute "},{"id":12,"href":"/docs/shortcodes/columns/","title":"Columns","section":"Shortcodes","content":" Columns # Columns help organize shorter pieces of content horizontally for readability.\n{{\u0026lt; columns \u0026gt;}} \u0026lt;!-- begin columns block --\u0026gt; # Left Content Lorem markdownum insigne... \u0026lt;---\u0026gt; \u0026lt;!-- magic separator, between columns --\u0026gt; # Mid Content Lorem markdownum insigne... \u0026lt;---\u0026gt; \u0026lt;!-- magic separator, between columns --\u0026gt; # Right Content Lorem markdownum insigne... {{\u0026lt; /columns \u0026gt;}} Example # Left Content # Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia. Mid Content # Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Right Content # Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia. "},{"id":13,"href":"/docs/shortcodes/details/","title":"Details","section":"Shortcodes","content":" Details # Details shortcode is a helper for details html5 element. It is going to replace expand shortcode.\nExample # {{\u0026lt; details \u0026#34;Title\u0026#34; [open] \u0026gt;}} ## Markdown content Lorem markdownum insigne... {{\u0026lt; /details \u0026gt;}} {{\u0026lt; details title=\u0026#34;Title\u0026#34; open=true \u0026gt;}} ## Markdown content Lorem markdownum insigne... {{\u0026lt; /details \u0026gt;}} Title Markdown content # Lorem markdownum insigne\u0026hellip; "},{"id":14,"href":"/docs/shortcodes/expand/","title":"Expand","section":"Shortcodes","content":" Expand # Expand shortcode can help to decrease clutter on screen by hiding part of text. Expand content by clicking on it.\nExample # Default # {{\u0026lt; expand \u0026gt;}} ## Markdown content Lorem markdownum insigne... {{\u0026lt; /expand \u0026gt;}} Expand ↕ Markdown content # Lorem markdownum insigne\u0026hellip; With Custom Label # {{\u0026lt; expand \u0026#34;Custom Label\u0026#34; \u0026#34;...\u0026#34; \u0026gt;}} ## Markdown content Lorem markdownum insigne... {{\u0026lt; /expand \u0026gt;}} Custom Label ... Markdown content # Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia. "},{"id":15,"href":"/docs/shortcodes/hints/","title":"Hints","section":"Shortcodes","content":" Hints # Hint shortcode can be used as hint/alerts/notification block.\nThere are 3 colors to choose: info, warning and danger.\n{{\u0026lt; hint [info|warning|danger] \u0026gt;}} **Markdown content** Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa {{\u0026lt; /hint \u0026gt;}} Example # Markdown content\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa Markdown content\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa Markdown content\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa "},{"id":16,"href":"/docs/shortcodes/katex/","title":"Katex","section":"Shortcodes","content":" KaTeX # KaTeX shortcode let you render math typesetting in markdown document. See KaTeX\nExample # {{\u0026lt; katex [display] [class=\u0026#34;text-center\u0026#34;] \u0026gt;}} f(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}\\,d\\xi {{\u0026lt; /katex \u0026gt;}} \\[\rf(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}\\,d\\xi\r\\] Display Mode Example # Here is some inline example: \\(\\pi(x)\\) , rendered in the same line. And below is display example, having display: block \\[\rf(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}\\,d\\xi\r\\] Text continues here.\n"},{"id":17,"href":"/docs/shortcodes/mermaid/","title":"Mermaid","section":"Shortcodes","content":" Mermaid Chart # MermaidJS is library for generating svg charts and diagrams from text.\nOverride Mermaid Initialization Config\nTo override the initialization config for Mermaid, create a mermaid.json file in your assets folder!\nExample # {{\u0026lt; mermaid [class=\u0026#34;text-center\u0026#34;]\u0026gt;}} stateDiagram-v2 State1: The state with a note note right of State1 Important information! You can write notes. end note State1 --\u0026gt; State2 note left of State2 : This is the note to the left. {{\u0026lt; /mermaid \u0026gt;}} stateDiagram-v2\rState1: The state with a note\rnote right of State1\rImportant information! You can write\rnotes.\rend note\rState1 --\u003e State2\rnote left of State2 : This is the note to the left. "},{"id":18,"href":"/docs/shortcodes/section/","title":"Section","section":"Shortcodes","content":" Section # Section renders pages in section as definition list, using title and description.\nExample # {{\u0026lt; section \u0026gt;}} First Page First page # Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Second Page Second Page # Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. "},{"id":19,"href":"/docs/shortcodes/section/first-page/","title":"First Page","section":"Section","content":" First page # Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\nDuis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n"},{"id":20,"href":"/docs/shortcodes/section/second-page/","title":"Second Page","section":"Section","content":" Second Page # Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\nDuis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n"},{"id":21,"href":"/docs/shortcodes/tabs/","title":"Tabs","section":"Shortcodes","content":" Tabs # Tabs let you organize content by context, for example installation instructions for each supported platform.\n{{\u0026lt; tabs \u0026#34;uniqueid\u0026#34; \u0026gt;}} {{\u0026lt; tab \u0026#34;MacOS\u0026#34; \u0026gt;}} # MacOS Content {{\u0026lt; /tab \u0026gt;}} {{\u0026lt; tab \u0026#34;Linux\u0026#34; \u0026gt;}} # Linux Content {{\u0026lt; /tab \u0026gt;}} {{\u0026lt; tab \u0026#34;Windows\u0026#34; \u0026gt;}} # Windows Content {{\u0026lt; /tab \u0026gt;}} {{\u0026lt; /tabs \u0026gt;}} Example # MacOS MacOS # This is tab MacOS content.\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia.\nLinux Linux # This is tab Linux content.\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia.\nWindows Windows # This is tab Windows content.\nLorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa protulit, sed sed aere valvis inhaesuro Pallas animam: qui quid, ignes. Miseratus fonte Ditis conubia.\n"},{"id":22,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/","title":"学术资源","section":"Docs","content":"English is not available now, use Chinese\n"},{"id":23,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E4%B8%93%E4%B8%9A%E4%B8%8E%E8%AF%BE%E5%A4%96%E8%B5%84%E6%BA%90/","title":"专业与课外资源","section":"学术资源","content":" 专业与课外资源 # 前言 # 内容尚未编写开发，暂不可用 本页的主要目的是帮助各位快速定位到你们需要的内容。\n目录 # 社区贡献者 # 感谢对开源社区所做的贡献，他们在本资源库的建立中发挥了作用。\n合计 # Tanya Tang Kayla Qu Robin Bao Boven Jiang Tobby Xu Catherine Zhang Wendy Qi James Zhou Angel Hu 生物 # Robin Bao 化学 # Boven Jiang 经济 # Tobby Xu 数学 # Wendy Qi 开发 # James Zhou 头 # Angel Hu 加入我们 # 如果你有不错的内容，或者知道优质的创作者，欢迎投稿。\n"},{"id":24,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E6%9C%AF%E5%B7%A5%E5%85%B7%E9%9B%86/","title":"学术工具集","section":"学术资源","content":" 学术工具集 # 前言 # 内容尚未编写开发，暂不可用 本页的主要目的是帮助各位快速定位到你们需要的内容。\n"},{"id":25,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E7%A7%91%E5%9C%A8%E7%BA%BF%E8%B5%84%E6%BA%90/","title":"学科在线资源","section":"学术资源","content":" 学科在线资源 # 前言 # 内容尚在编写开发，并不完善 本页的主要目的是帮助各位快速定位到你们需要的内容。\n目录 # 通用 美术\u0026amp;历史 自然科学 人文科学 数学 语言 提示 # 这很好查询。比如我要找，物理，那它属于\n学科 自然科学 物理 于是直接点击右边的自然科学即可找到。\n社区贡献者 # 感谢对开源社区所做的贡献，他们在本资源库的建立中发挥了作用。\n合计 # Cindy Pan Robin Bao Boven Jiang Tobby Xu James Zhou Angel Hu 生物 # Robin Bao 化学 # Boven Jiang 经济 # Tobby Xu 开发 # James Zhou 头 # Angel Hu 加入我们 # 如果你有不错的内容，或者知道优质的创作者，欢迎投稿。\n"},{"id":26,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E7%A7%91%E5%9C%A8%E7%BA%BF%E8%B5%84%E6%BA%90/%E7%BE%8E%E6%9C%AF%E5%8E%86%E5%8F%B2/","title":"美术历史","section":"学科在线资源","content":" 美术\u0026amp;历史 # Google Art Project # 简介 Google Art Project是Google与世界各地博物馆合作，利用Google街景技术拍摄博物馆内部实景，并且以超高解析像拍摄馆内历史名画。目前已经与全球151家艺术博物馆签署了新的合作关系。 Gallerix # 简介 世界名画档案馆 Gallerix 专门收集世界著名画家的作品，收集超过4万多名艺术家的近17多万幅作品。 芝加哥（艺术）博物馆 # 简介 公开了5万多幅收藏品的高清图像。 大都会艺术博物馆 # 简介 开放了约37万件藏品的高清图像。 荷兰国立博物馆 # 简介 开放了约60万件作品的高清数字版权，需注册。 美国国家艺术馆 # 简介 提供了包括梵高、莫奈等大师超5万个艺术品图像。 盖蒂博物馆 # 简介 收藏了超过10万件的高清艺术品，提供了公开免费下载的入口。 巴黎博物馆协会 # 简介 提供超10万张藏品图，可免费商用，包含画作、装饰品、雕塑等。 梵高博物馆 # 简介 该网站收集作品4369幅，可按艺术家、位置、年份、类型等进行查找，可免费下载不可商用。 新版故宫博物院藏品总目 # 简介 故宫开放186万藏品的数据库，量多但质低。 Artvee # 简介 这个网站可以下载一些高品质艺术品图片，汇集了大都会博物馆 、耶鲁大学美术馆、盖蒂博物馆、波士顿公共图书馆、维也纳博物馆等知名机构发布的藏品图片，点击即可直接下载，速度一般，不过查找起来方便快捷 数字馆藏 N-YHS Digital Collections # 简介 待办 大英博物馆 # 简介 新开放了30万张高清作品图像，可在线上免费浏览。 故宫博物院 # 简介 各种全景，藏品，建筑……数字漫游做得也很不错。应该是国内做得最好的线上博物馆了。 故宫名画记 # 简介 也是故宫博物院出品，全是国宝级的藏画，细节也很丰富，还有语音讲解。质量很棒，不过数量有点少。 中国美术馆 # 简介 收藏了各类美术作品10万多件，都是高清大图，还有很多3D虚拟全景展览。 纽约大都会艺术博物馆 # 简介 访客人数世界前三的纽约大都会艺术博物馆，藏品总量150万件，大概有25%免费开放。名画也可以直接下载。画的下方还有艺评人写的文章，通过艺术家的故事来讲一个流派，蛮有趣的。 大英博物馆 # 简介 开放了几百件大英博物馆藏品的3D模型，可以近距离“触摸”这些珍宝。比如最有名的罗塞塔石碑等等。 德国科隆东方艺术博物馆 # 简介 数字资源开放获取，馆藏丰富，清晰度一般。 上海博物馆 # 简介 文物收藏包括青铜、陶瓷、书画、雕塑、甲骨、符印、货币、玉器、家具、织绣、漆器、竹木牙角、少数民族文物等31个门类，尤以青铜、陶瓷、书画最为突出。截至2019年末，馆内藏品数量达1020220件/套，其中珍贵文物达144142件/套。 展厅 古代青铜馆：古代青铜馆展厅面积1200平方米，陈列精美青铜器400余件。陈列分为七大部分：“萌生期青铜器”“育成期青铜器”“鼎盛期青铜器”“转变期青铜器”“更新期青铜器”“边远地区的青铜艺术”“中国青铜器的冶炼和铸造”，完整反映了公元前21世纪至公元前3世纪中国古代青铜艺术的发展历史。\n古代雕塑馆：中国古代雕塑馆展厅面积640平方米，其中有120余件展品。展厅以金、红、黑三色为基本色调，以佛教艺术中常用的莲瓣形做隔墙，石窟寺中的佛龛做壁橱，以及露置的陈列形式。除陈列部分木雕、陶塑外，以石刻塑像为主，这里有北魏、北齐、北周和隋唐雕塑，以及南石刻、金铜佛像等。陈列分为四大部分：“战国秦汉时期的雕塑”“魏晋南北朝隋代时期的雕塑”“唐五代时期的雕塑”“宋元时期的雕塑”。其中佛教造像雕塑约占展品总数的80%，为雕塑馆的特色。\n古代陶瓷馆：中国古代陶瓷馆展厅面积1300平方米，共陈列了展品500余件。其中有新石器时代的彩陶和灰陶、商周及春秋战国时代的原始青瓷、东汉时代的的青瓷，还有唐朝的唐三彩。宋、金、辽时代，各地窑场林立。元、明、清三代，景德镇成为中国瓷业的中心，所烧制的釉下彩、釉上彩和颜色釉瓷器皆有展出。陈列分为七部分：“新石器时代陶器”“商周原始瓷的出现及汉魏（吴）、两晋、南北朝的陶瓷”“唐代彩色釉陶器的盛烧和唐五代瓷器的发展”“百花争艳的宋、辽、金、元陶瓷”“宋、元、明、清景德镇瓷器”“明清景德镇以外地区的陶瓷器”“制瓷作坊与窑炉”，全面反映了中国古代陶瓷的发展历史。\n历代书法馆：中国历代书法馆展厅面积600平方米，集中了各个时期的书法名作，展出约60件书法精品。陈列分为五大部分：“篆书书艺与隶书书法”“晋唐书法”“宋代书法”“元代书法”“明代书法”“清代书法”，展示了中国书法艺术的历史轨迹。\n历代玺印馆：中国历代玺印馆是中国第一个专题陈列玺印篆刻的艺术馆。展厅面积380平方米，展出玺印篆刻500余件。整个陈列以印章艺术的发展历史为线索，上自西周，下迄清末。展馆内借助高低错落的展柜，应用多种技术手段，使实物与辅助陈列相互配合。陈列分为五个部分：“早期的古玺印”“秦汉规范的确立与延续”“唐宋金元官私印的新样式”“明清文人篆刻的兴起和繁盛”“明清印材与印钮雕刻”，展示了中国印史的悠久历程和各个时期印章的不同风貌及其深厚的艺术内涵。\n历代绘画馆：展厅面积1200平方米，共陈列历代绘画精品120余件，从唐代至近代，各种绘画门类均有所体现。绘画有着深厚的传统和独特的民族风格。展厅按时间序列分为七个部分：“唐宋时代绘画”“元代绘画”“明前中期绘画”“明后期—清前期绘画（明万历—清康熙）”“清中期绘画（雍正—嘉庆）”“清晚期绘画（道光—宣统）”、以及“两涂轩”珍藏书画，反映出中国绘画的悠久传统和深厚底蕴。\n少数民族工艺馆：展厅面积700多平方米，集中陈列了少数民族的服饰工艺、染织绣、金属工艺、雕刻品、陶器、漆器、藤竹编和面具艺术等近600件。表现了少数民族工艺品的造物文化与艺术审美。\n历代钱币馆：中国历代钱币馆面积740平方米，展出文物3300余件，以中国古代钱币发展的历程为线索，集中展现了中国货币发生、发展和中外经济文化交流的历史概貌。同时该馆专辟“施嘉幹钱币专室”和“杜维善、谭端言中亚古币专室”，专题陈列钱币收藏家施嘉幹先生及杜维善夫妇捐赠的相关藏品。\n明清家居馆：明清家具馆展厅面积700平方米，展出明清时代中国家具精品100多件，反映了明清时期中国古代家具制作工艺的鼎盛面貌和艺术风格。该陈列还复原了明清时代的厅堂与书房以再现古代家具的使用场景。\n古代玉器馆：古代玉器馆展陈面积500平方米，展出从新石器时代至清代的玉器精品约300件。陈列分六大单元：“神秘奇幻的史前玉器”“灵动不拘的春秋战国玉器”“端庄典雅的夏商西周玉器”“雄健瑰丽的汉晋玉器”“清新多元的唐宋辽金玉器”“炫巧争艳的元明清玉器”，大致反映出8000年中国玉文化的发展面貌。\n首都博物馆 # 简介 首都博物馆馆内文物类型有青铜器、陶瓷器、佛造像、玉器、金银器、钱币、书法、绘画、织绣、文玩等。截至2019年末，首都博物馆馆内藏品达124808件/套，其中珍贵文物达63170件/套。 展厅 北京历史文化 # 该部分是本篇的核心，其主旨是再现北京历史，阐释京城文化的韵味，表现北京对中国传统文化的继承与弘扬，揭示北京作为一座融合了多民族与多元文化的城市逐步递升为中国首都与文化中心的历史规律。这部分展览内容以历史文化为视角，展示了从46万年前的远古时期至新中国建立的岁月中，北京经历了从原始聚落形成城市，从北中国的政治中心跃升为大一统封建王朝的都城、中华人民共和国的首都，直至发展为建设中的国际大都市这一不断攀升的历史进程，通过对北京的城市定位、政治经济、民族融合、中外文化交流、宗教发展等各领域的展示，概括了北京文化所具有的荟萃性、创新性，多元性、连续性与递升性五个特点。该部分包括十个部分；内容结构上选取了“海陵王迁都”“元大都积水潭码头”“北京保卫战”“盛世京师（康雍乾时期的北京）”“五四运动”“开国大典”六个场景作为串联北京历史的节点。这部分共展出文物675组件与大量图表、照片，上展文物包括石器、陶瓷器、青铜器、金银器、玉器、织品、书画、家具、拓片等。\n世界文明概览 # “世界文明概览”部分是解读“北京历史文化”的辅助陈列。它与“北京历史文化”依时间序列平行展示，以图片与文字为北京史的展示提供了一个以世界为范围的广阔背景，从而加深观众对北京历史文化内涵的理解，激发观众的思考。\n“北京历史文化”（内圈）与“世界文明概览”（外圈）位于展线的两侧平行展示，观众在观览过程中同时领略中外文明的精彩与跌宕，整个外圈已成为一个完整的辅助展品来诠释内圈——北京的历史文化。这一展陈形式为“古都北京·历史文化篇”营造了一个语境：北京从古至今都是一座开放、包容的城市。\n专题、艺术陈列 # 首都博物馆精品陈列有《北京古代佛塔文物展》《古代瓷器艺术精品展》《燕地青铜艺术精品展》《古代书法艺术精品展》《古代绘画艺术精品展》《古代玉器艺术精品展》《古代佛教艺术精品展》。这六个馆藏精品展览和《京城旧事——老北京民俗展》是对北京文化展现的补充和深化。\n《北京古代佛塔文物展》 # 公元前2年，佛教正式传入中国，在中国两千余年历史上，形成了具有中国文化特色的禅宗、净土宗等众多宗派，产生了建筑、雕塑和绘画等艺术形式与精美作品，成为中国传统文化的重要组成部分。 佛教在北京的长足发展，留下了寺庙、佛塔、造像、佛画、法物等种类繁多、内容丰富的艺术作品。这里首都博物馆遴选部分佛塔文物进行展出，以期展现古都北京的佛教文化底蕴、佛教文化风貌等，以及建筑、雕塑和各种工艺等发展水平。\n《古代瓷器艺术精品展》 # 古代瓷器展位于方形展厅四层E2厅。展出了北京作为都城历史时期出土和传世的瓷器，其中以宋辽金至明清时期北京地区遗址、墓葬、窖藏出土的瓷器。展览分为四个部分，共展出文物170组件。展出有宋辽金时期的越窑青釉划花宴乐人物纹注壶、定窑白釉童子诵经壶、绿釉“杜家”款璎珞纹净水瓶等；元大都出土的青白釉多穆壶、青花凤首扁壶、釉里红花卉纹玉壶春瓶、钧窑天蓝釉贴花兽面纹双耳连座瓶、磁州窑白地黑花龙凤纹四系扁壶等；明、清时期的宣德款洒蓝釉钵、成化斗彩葡萄纹杯、雍正珊瑚红地珐琅彩花鸟瓶、乾隆松石绿地粉彩蕃莲纹多穆壶等名贵瓷器都是难得一见的稀世精品。反映出中国陶瓷史发展的阶段及当时北京历史发展的轨迹。展览氛围恬静柔和，采用群体陈列方式。\n《古代佛像艺术精品展》 # 古代佛像展位于方形展厅四层E1厅。主要展出汉藏佛像精品。展览的主题是：展示中国汉藏佛像艺术的历史风貌，同时展示北京地区佛教文化的底蕴和地域文化特色。通过这个展览，让观众了解佛像艺术在中国汉族、藏族地区发展、演变的脉络和形成的不同的文化艺术风貌；欣赏佛像艺术表现的中华文化特有的品格和艺术神韵；了解佛像艺术蕴藏的丰富的历史文化内涵和与中国古代社会政治、经济、文化及人们审美观念的关系。展览分为汉传佛像艺术和藏传佛像艺术，共展出佛像262尊，种类齐全，造型各异，风格多样，其中大部分佛像是首次向公众展示的馆藏珍品。\n《古代玉器艺术精品展》 # 古代玉器展位于圆形展厅五层K厅。展览分为三部分，展出文物181组件。展品中有大量的王公贵族墓出土的玉器，以及带有皇帝年款及刻有御制诗文的玉器，设置了“中国古代主要玉材一览表”、部分玉器使用示意图，设计分为静态展区、动态展区。\n《燕地青铜艺术精品展》 # 燕地青铜展位于圆形展厅四层J厅。展览以中原文化与北方草原文化青铜器的对比、西周与东周青铜器的对比，展厅中心设计了一座显示出夯土层理的方城，象征着房山琉璃河燕国西周都城。城墙内、外壁与展厅四壁的展柜形成了三层同心展线。西周展品位于展厅中心，东周展品则位于展厅四壁的环形展柜，两周展品都依照兵器、礼乐器、杂器的顺序对应摆放，实现了两种青铜文化的对比。\n中国地质博物馆 # 简介 中国地质博物馆收藏地质标本55万余件，涵盖地学各个领域。其中有巨型山东龙、中华龙鸟等恐龙系列化石，北京人、元谋人、山顶洞人等著名古人类化石，以及大量集科学价值与观赏价值于一身的鱼类、鸟类、昆虫等珍贵史前生物化石；有世界最大的“水晶王”、巨型萤石方解石晶簇标本、精美的蓝铜矿、辰砂、雄黄、雌黄、白钨矿、辉锑矿等中国特色矿物标本，以及种类繁多的宝石、玉石等一批国宝级珍品。 文物 截至2013年，馆内藏有各类地质标本12万余件，其中包括古生物1.3万件、地层2.1万件、矿物1万件、岩石6000多件、宝石1000多件、矿床3.3万件、地质现象1000多件，还有多件晶洞和其他标本等。其中巨型山东龙、水晶王和在辽宁西部发掘的原始鸟类化石等极为珍稀。 展厅 地球展厅 # 地球厅以动力为主线，介绍了在内外动力的作用下，地球上发生的重要地质作用。东展线介绍内动力地质作用，以板块运动、褶皱断裂、火山、地震等地质作用为重点，西展线以外动力地质作用为主，主要介绍了水和风的地质作用。\n相对来说，内动力地质作用更加宏观壮丽，它们主要是使地壳上升、增厚，形成许多巨大雄传的高山峻岭，而外动力地质作用则比较和缓，好像一把刻刀，雕刻出各种壮美的山川地貌。\n宝石展厅 # 宝石厅展示宝石、玉石、有机宝石、贵金属等材料及其成品，并融入宝石鉴定、宝石鉴赏、宝石琢型、宝石评价、宝石成因、宝石微观世界、宝石分布、宝石开采、宝石加工、首饰镶嵌、人工改善宝石与人工宝石及其制造方法以及宝石文化等知识点和兴趣点。\n宝石厅以单晶宝石和玉石为主，并以天然宝石与人工宝石对比展示，以便鉴别市场上常见的相似的宝石。\n中心部位：以一件大气、通灵、高档的展具作为展心，所展示的展品随每期主题的变换进行不定期的调换。\n矿物岩石展厅 # 矿物岩石厅采用雅俗共存、动静结合、虚实呼应、寓教于乐的设计方式，使观众通过参与、欣赏展厅的展品，可了解自然界中矿物岩石的成因，原始产出情况、自然界种类繁多千资百态的矿物岩石、代表性矿物岩石的感官特征及可供人们使用的特性。\n史前生物展厅 # 史前生物展厅，以生物进化过程中发生的重大事件为线索，向观众介绍生物的发展厅程和各地质时期常见的化石，展示地球上生物的发生、进化和灭亡的过程。\n从空间布局上，整个展厅可以分为两大部分。\n第一部分是小序厅，包括了一面艺术化的化石精品墙、一个可以互动操作的多媒体展具——简明生物分类查询系统，及一些有关化石的基本常识介绍。\n第二部分是该展厅的主要陈列内容，共分为八个单元。\n第一单元——最早期的生命 第二单元——生物大爆发 第三单元——海生无脊椎动物时代 第四单元——脊椎动物的出现 第五单元——生物登陆 第六单元——生物大绝灭 第七单元——恐龙与鸟类 第八单元——哺乳动物与人类 史前生物展厅的南过道，还陈列了鱼龙、中国安琪龙、翼龙化石的模型各一件，以及一件观众可以触摸的长达5米的大型鱼龙化石、一个演示化石是如何形成的多媒体展具。\n分馆 黄果树奇石馆：位于黄果树风景名胜区，于2010年6月15日开馆，2012年成为“中国地质博物馆黄果树馆”。截至2013年，馆藏标本1500余件。\n本溪地质博物馆：座落在本溪国家地质公园本溪水洞景区内，占地面积为13000平方米，建筑面积3080平方米。馆内陈列了本溪国家地质公园的地质遗迹，史前地质遗迹，国家级珍贵标本30余件，珍稀标本3300余件。\n宜州化石馆：创建于1994年，是辽宁省第一座古生物化石博物馆，1996年被接收为中国地质博物馆辽西分馆。\n中华恐龙馆（中国地质博物馆常州分馆）：位于常州新北区汉江路1号的中华恐龙园内，是国土资源部和常州市人民政府的合作项目。\n江西省地质博物馆（中国地质博物馆江西分馆）：其前身是1927年“江西矿业调查所”的“江西地质矿产标本室”和1935年李四光教授创立的“庐山地质馆”。新建的江西省地质博物馆于2006年2月27日正式开馆。\n中国地质博物馆西峡分馆：前身是西峡恐龙蛋化石博物馆，始建于2000年10月，占地3500平方米，总投资1800万元。\n北京房山世界地质公园：2010年5月15日起开放，是中国地质博物馆的房山分馆，位于房山区长沟镇，是房山世界地质公园的组成部分。博物馆占地面积91.65亩，建筑面积1万平方米。\n嘉荫恐龙国家地质公园：2010年7月31日正式挂牌，是一座集科普、娱乐、观光、休闲于一体，将自然科学和人文景观紧密结合的大型综合博物馆，是中国第五座恐龙博物馆，也是一座集保护区和展览馆于一身的园中馆，是国家级地质公园、国家4A级旅游景区及青少年科普教育基地。\n中国地质博物馆烟台馆：位于烟台市莱山区国际植物艺术博览苑用地西侧，北靠黄海、西临游艇中心和大型度假村、南接滨海路。景观设计面积约 7.9万平方米。\n南京博物院 # 简介 南京博物院拥有各类藏品432768件（套），珍贵文物371032件（套），珍贵文物数量居中国第二，仅次于故宫博物院。 四川省博物馆 # 简介 待办 浙江省博物馆 # 简介 待办 北京画院美术馆 # 简介 待办 江苏省美术馆 # 简介 待办 古籍馆 # 简介 中国古代文献图书馆，搜索各种古籍资料，很方便。 首都博物馆可移动文物普查成果数字化平台 # 简介 待办 麦田艺术 # 简介 可以免费下载。名画挺多，可以拿来作插画、配图、自用等等，提升你的艺术逼格。 ProQuest历史报纸 # 简介 近现代中国英文报纸库。 营业范围 ProQuest历史报纸：中国报纸收藏，1832-1953年。\n主要包括以下报纸：\n报纸名称 收录年限\n《北华捷报》/《字林西报》The North -China Herald (1850-1941) 《大陆报》The China Press (1925-1938) 《中国评论周报》The China Critic (1939-1946) 《密勒士评论报》Millard’s Review /The China Weekly Review (1917-1953) 《教务杂志》The Chinese Recorder (1868-1940) 《中国丛报》The Chinese Repository (1832-1851) 《北京日报》Peking Daily News (1914-1917) 《京报》Peking Gazette (1915-1917) 《北京导报》Peking Leader (1918-1919) 《上海泰晤士报》The Shanghai Times (1914-1921) 《沪报》The Shanghai Gazette (1919-1921) 《广州时报》The Canton Times (1919-1920) 晚清和民国期刊全文数据库（1833-1949） # 简介 该库收录了1833-1910年间300余种期刊，几乎囊括了当时出版的所有期刊，拥有众多“期刊之最”，用户可从标题、作者、刊名等途径对25万余篇文章进行检索并浏览、下载全文。 百科 19世纪中叶，中国社会风起云涌，鸦片战争、甲午海战、戊戌变法、辛亥革命……中国从此由封建社会进入半殖民地半封建社会，历史在此汇聚，思想在此碰撞，文化的丰硕果实——晚清期刊也由此应运而生。\n晚清期刊反映了中国从封建社会向现代社会转变的特殊历史时期的政治、经济、军事、外交、教育、文化、科技、宗教等各方面的内容，不少期刊中表达了不同乃至互相对立的观点立场，客观反映了这一历史时期的真实面目，具有相当高的研究利用价值。晚清期刊是中国社会发展过程中的一个重要历史记录，是珍贵的文化遗产之一。\n为了更好地揭示晚清期刊的学术价值和历史价值，《全国报刊索引》编辑部秉承“普及知识、传承文明”的出版理念，在保护传统纸质期刊的基础上，制作并推出了全新的数字化产品——《晚清期刊全文数据库》。该库收录了1833-1910年间300余种期刊，几乎囊括了当时出版的所有期刊，拥有众多“期刊之最”，用户可从标题、作者、刊名等途径对25万余篇文章进行检索并浏览、下载全文。\n《晚清期刊全文数据库》凝结着全体《全国报刊索引》人的心血，同时也得到了海内外图情单位和专家学者的大力支持与协助。我们希望它能为中外学者和广大读者研究、了解晚清历史提供一个收录全面、内容权威、检索便捷的文献数据。\n晚清期刊全文数据库（1833～1911） # 简介 共收录了从1833年至1911年间出版的500余种期刊，21900余期，50万余篇全文，几乎囊括了当时出版的所有期刊，拥有众多的“期刊之最”，是研究晚清历史的读者用户必备的数据库检索工具。 鸦片战争纪念馆 # 简介 线上博物馆，有数据库，藏品展示等。 百科 建馆于1957年，楼建筑面积约为2400平方米，是一座收藏和介绍林则徐禁烟及鸦片战争相关史料的专业博物馆，1972年曾一度改名为鸦片战争虎门人民抗英纪念馆，在1985年重新定名为虎门林则徐纪念馆，该馆管理的林则徐销烟池与虎门炮台旧址，更是全国重点文物保护单位。 辛亥革命纪念馆 # 简介 待办 五四运动纪念馆 # 简介 待办 八一南昌起义纪念馆 # 简介 待办 超星国家档案文献库 # 简介 待办 第二历史档案馆 # 简介 待办 中国第一历史档案馆 # 简介 待办 台湾中研院近代史研究所档案馆 # 简介 待办 北京市档案馆 # 简介 待办 上海档案信息网 # 简介 待办 江苏档案信息网 # 简介 待办 辽宁省档案馆 # 简介 待办 四川省档案资源网 # 简介 待办 广东档案信息网 # 简介 待办 福建档案馆 # 简介 待办 武汉市档案馆 # 简介 待办 青岛档案信息网 # 简介 待办 南京市档案馆 # 简介 待办 苏州市档案馆 # 简介 待办 南京大屠杀历史图片 # 简介 待办 中国1966-1976档案（影像） # 简介 待办 香港历史档案 # 简介 待办 "},{"id":27,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E7%A7%91%E5%9C%A8%E7%BA%BF%E8%B5%84%E6%BA%90/%E8%87%AA%E7%84%B6%E7%A7%91%E5%AD%A6/","title":"自然科学","section":"学科在线资源","content":" Natural Science # Natural Science resources, include Web Tools, YouTubers, NGOs.\nPhysics # WolframAlpha # # 简介 #  Step-by-step solution to different calucation question. Again, it\u0026rsquo;s for you to check the answer or go for help.\n价格 # Basic\nPersonalized experience with customizable settings Does not include step-by-step solutions $0 per month, billed $0 annually Pro\nEnhanced features with step-by-step solutions Increased computation time and calculator Web Apps $7.25 per month, billed $60.00 annually Pro Premium\nComplete access to all features and priority customer support $8.25 per month, billed $99.00 annually 点评 # You can not use very casual natural language.\nYou may need some practice before using it very well.\nFree plan is enough for daily usage.\n营业范围 # Astrophysics Electricity \u0026amp; Magnetism Fluid Mechanics Mechanics Nuclear Physics Optics Oscillations \u0026amp; Waves Particle Physics Physical Constants Physical Effects Physical Principles Quantum Physics Relativity Statistical Physics Thermodynamics 示例 # work F=30N, d=100m centripetal acceleration, 30mph, 500 ft Doppler shift 300Hz, 75mph ideal gas law 2.2mol, 2.0atm, 500K More FreeScieneLessons # # 简介 #  Including Biology, Chemistry, Physics short lessons for key concepts, also skills practical exams.\nChemistry # WolframAlpha # # 简介 #  Step-by-step solution to different calucation question. Again, it\u0026rsquo;s for you to check the answer or go for help.\n价格 # Basic\nPersonalized experience with customizable settings Does not include step-by-step solutions $0 per month, billed $0 annually Pro\nEnhanced features with step-by-step solutions Increased computation time and calculator Web Apps $7.25 per month, billed $60.00 annually Pro Premium\nComplete access to all features and priority customer support $8.25 per month, billed $99.00 annually 点评 # You can not use very casual natural language.\nYou may need some practice before using it very well.\nFree plan is enough for daily usage.\n营业范围 # Bonds \u0026amp; Orbitals Chemical Compounds Chemical Elements Chemical Quantities Chemical Reactions Chemical Solutions Chemical Thermodynamics Cheminformatics Functional Groups Ions Nuclear Chemistry Quantum Chemistry 示例 # H2SO4 0.2 mol CH4 + O2 -\u0026gt; 7 mL H2O + CO2 100 mL of 1.5 molar K2CO3 in THF oxalyl dihydrazide vs N,N-di-N-butylformamide More FreeScieneLessons # # 简介 #  Including Biology, Chemistry, Physics short lessons for key concepts, also skills practical exams.\nThe Organic Chemistry Tutor # # 简介 # Explains mainly organic chemistries, also includes many other contents which all have high quality of explanation.\nNileRed # # Intro # He is a YouTuber, the channel is not too much about school lessons. But more about interest. There are many famous and fun Chemistry experiments, such as turn toilet paper into alcohol.\nYou may get some idea about your EE or IA as your common sense got challenged.\nPlayList # Aluminum and Mercury Turning old jewelry into pure gold bars Turning plastic gloves into hot sauce Making aerogel All about Mercury, the Liquid Metal | Element Series Making transparent wood More Info # Capturing the natural beauty of chemistry\nI find that chemistry is often taught poorly or without a purpose. Because of this, people tend to lose interest and sometimes even start to hate it. In each video that I make, I try to balance theory with purpose. My goal is to capture the natural beauty of chemistry in fun and interesting ways.\nIn terms of education, I have a BSc in Biochemistry, with a minor in pharmacology. However, I\u0026rsquo;ve always been a lot more drawn to applied chemistry. So after finishing my degree, I worked as a lab tech in an organic lab, and then as a chemistry grad student. However, I ended up leaving my graduate studies early to focus on this channel. Now, making chemistry videos has become my full-time job!\nBiology # FreeScieneLessons # # 简介 #  Including Biology, Chemistry, Physics short lessons for key concepts, also skills practical exams.\nYourGenome # # 简介 #  Youtube channel where you can find everything you\u0026rsquo;d like to know about DNA, genomes and genes.\n"},{"id":28,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E7%A7%91%E5%9C%A8%E7%BA%BF%E8%B5%84%E6%BA%90/%E8%AF%AD%E8%A8%80/","title":"语言","section":"学科在线资源","content":" Languages # Languages resources, include Web Tools, YouTubers, NGOs.\nEnglish # IGCSESUCCESS # # 简介 #  Tips and skills for IGCSE EFL students.\nSparknotes-literature Study # # 简介 #  Extremely useful for literature reading, covering summary, analysis of character, themes, symbols and so on.\nLearnAndRecord # # 简介 #  WeChat Channel for English learning. Learn through news and policies from journals.\nTalk is cheap. Show me the action.\nMore Info # WeChat Channel A：LearnAndRecord WeChat Channel B：英语学习社 Personal WeChat：learnrecord bilibili：LearnAndRecord Weibo/Sina Weibo：@LearnAndRecord Xiaohongshu：LearnAndRecord\n中文 # 北京鲁迅博物馆（北京新文化运动纪念馆） # # 简介 #  资料查询在线检索系统：不只有语录，著作、书信、日记、专题等资料比较全\n国图公开课 # # 简介 #  国家图书馆旗下的网站，虽然知名度不是很高，但课程质量和讲师质量真的很高。\n百科 # 国图公开课是国家图书馆借鉴“慕课”的大规模、开放、在线理念，以传承和弘扬先进文化与中华优秀传统文化为核心，依托国家图书馆的馆藏海量资源，设立了专题课程和读书推荐等栏目，采取线上线下相结合的互动模式，推送多种形态的学习资源，创立面向社会大众，严肃、通俗、负责的通识教育平台。\n中国社会科学院近代史研究所 # 台湾中研院近代史研究所（新版网页） # # 简介 # 旧版网页\n中国中俄关系史研究会 # 南京大学中华民国史研究中心（新版网页） # # 简介 # 旧版网页\n中日网（南京师范大学南京大屠杀研究中心） # 日本现代中国学会 # 早稻田大学中国外交史研究会 # 中国社会科学院中国边疆史地研究中心 # 香港档案学会 # 俄亥俄州立大学东亚语言文学系 # 澳大利亚国立大学亚洲太平洋历史研究 # 哥伦比亚大学东亚语言与文化系 # 加州大学洛杉矶分校中国研究中心 # "},{"id":29,"href":"/docs/%E5%AD%A6%E6%9C%AF%E8%B5%84%E6%BA%90/%E5%AD%A6%E7%A7%91%E5%9C%A8%E7%BA%BF%E8%B5%84%E6%BA%90/%E9%80%9A%E7%94%A8/","title":"通用","section":"学科在线资源","content":" 通用 # 可以用于多个，跨学科的资源。\nKhan Academy # 简介 ... On Khan Academy, you are offered with free recorded lessons of a specturm of subjects, including Mathematics, Natural Science, Social Science, Arts, Humanities and Languages.\nIt has produced over 8,000 video lessons teaching a wide spectrum of academic subjects, originally focusing on mathematics and sciences. All resources are available for free to users of the website and application.\nAs of 2018, over 70 million people use Khan Academy, out of which 2.3 million students use it to prepare for the SAT.\nAs of February 2022, the Khan Academy channel on YouTube has 7.11 million subscribers and Khan Academy videos have been viewed more than 1.94 billion times.\nThis website is also extremely useful if you are preparing for the Advance Placement (AP) exams.\n营业范围 # It offers\nMath: Pre-K - 8th grade Math: Get Ready Courses Math: High School \u0026amp; College Test Prep Science Computing Arts \u0026amp; Humanities Economics Reading \u0026amp; Language Arts Life Skills 特性 # Free Interactive Seneca # 简介 # You can find some free resource for IGCSE or A-Level. It offers a great number of free and paid study materials of nearly every subject.\nEDX # 简介 # 麻省理工和哈佛大学的大规模开放在线课堂平台，大部分是英文的，但可以听清华、北大、香港大学、香港科技大学的课程\nPhysics \u0026amp; Maths Tutor # 简介 # Includes detailed notes for different subjects in IGCSE and A-Level.\nPastpapers.co # 简介 #  Website for past papers and mark schemes\nProfessor Dave Explains # 简介 # A youtube channel covering knowledge from humanities to natural science. The contents about Biology and Chemistry are especially recommended.\n"}] |