Hugo: adding more pages to single-page themes - themes

Hugo is a general purpose website framework and a static site generator. However, most of the themes are single page themes.
Is it possible to add more pages to these single-page themes in Hugo?
I am specifically interested in the Dimension theme.
Thank you very much for your help.

This depends on how the theme is constructed. In Dimension's case, the answer is no - you can add new markdown files to your content folder, but they will only be rendered on the index page, not as their own individual pages. If you want to generate multiple pages, you will have to either edit the theme or choose a new theme that supports multiple pages.
To edit the theme, see the docs on customising a theme and creating a theme. You will also need to know Hugo templates, so the go template primer is an essential read. Editing themes can be a little tricky, but if you have worked with other templating languages then it is not too much different.
In your case, you will want to edit layouts/_default/single.html to create a single-page view for all of your markdown files. You will also need to edit layouts/index.html to link to them from the index page, otherwise no-one will find them.

Hugo is not just a general purpose website framework/generator. I have been using it for article publishing, news website and to generate a blog! Most of the themes are single pages because people created themes in the way they love. Although still in development, you can check my website Desktop Luxury that is fully static and built with hugo. It's super fast, supports AMP and users just love it. They can't tell the difference between Wordpress sites and Desktopluxury.com in terms of look. Note: The difference is clearly visible in terms of load time, speed and customization ability!
Although it varies by theme, you can easily create a .md (file that contains content - similar to .html*) file out of your blog folder. For example, you want to create an About page. In the root folder that contains your hugo files, create a directory root/content/blog. Add permalinks to your config file that tells the theme to categorize files present in /root/content/blog folder as the blog files. Create the pages such as an about.md & contact.md in root/content folder. They won't show in the blog list, however, they'll be rendered and accessed by siteurl.xyz/about or siteurl.xyz/contact.
*I said .md file similar to .html file as the OP seems new to webdevelopment.
EDIT:
Final homepage after adding few posts
I just downloaded the theme mentioned in the question, added few .md files by opening CMD in the root directory of Hugo website folder and running command ~~ $ hugo new professional.md ~~
Created various pages and added content in them just like we write articles. I achieved the result you wanted with no issue at all. It was super easy!

Related

ExpressionEngine images/fonts missing from subtemplates (template in template group)

I have set up a site with ExpressionEngine, and put the fonts and images folder in the root of the site, and they work absolutely fine for pages that are template group home pages (with the house icon) but they suddenly dont work on pages that are added to the same template group as new templates...
the paths look like this in the html:
href="fonts/Anybody.woff2" or url(img/header_stripes_light.svg)
where should I copy the fonts and images folders to make them also work in subtemplates? I couldn't find anything useful in their documentation about this issue.
That's an easy one! make those url's absolute and you're fine.
Do it like this: href="/fonts/Anybody.woff2" or url(/img/header_stripes_light.svg)
Your paths are relative to the page now, so without the initial "/"

Magento Templates - Can extensions be bundled with a theme?

I have a real noob Magento question. I'm helping a friend change the template their store is using but they are worried about losing the functionality of some of their extensions such as ajaxsearch. They don't know if it's actually an extension or part of the template. I can't seem to figure out if some of the extensions are built into the theme or if they are completely separate extensions. Is there an easy way to tell?
To give an example the ajaxsearch JS file's path seems to in the template path e.g http://www.example.com/skin/frontend/default/templatename/js/ajaxsearch.js
and if I go to system > configuration I can see it listed in the sidebar under Templates-Master (which I think is a brand name). In this case is this an extension and is this how file paths work for extensions? The fact that skin is in the file path is throwing me off.
Thanks!
Fast way:
Each Magento extension provided as archive (.tgz). Unpack it to some folder outside Magento and check have it next path or not:
unpacked_folder/skin/frontend/default/templatename/js/ajaxsearch.js
(another trick is look in the first lines of ajaxsearch.js file, authors often write extension or theme names in it).
Long way:
Find where is this file included on page. Search for 'ajaxsearch.js' in xml files placed in app/design/frontend/default/templatename/layout/
if not found, try to search in app/design/frontend/default/default/layout/ etc.
For example you find it in somefile.xml
Try to find which extension include this file. For doing this search 'somefile.xml' in config.xml files in local and community pools:
app/code/local/some/extension1/etc/config.xml
app/code/local/some/extension2/etc/config.xml
app/code/community/some/extensionN/etc/config.xml
etc
If you found it in ...some/extensionX/etc/config.xml - this mean what ajaxsearch.js belongs to some_extensionX extension. If not found - it belongs to theme.

updating existing site built in dreamweaver, handling DWT file

I have a client that want's me to make a change to her OTHER site. The other site was built using Dreamweaver.
I guess (I don't build using Dreamweaver) the site pages are being controlled by the template file EXCEPT for the content that is specific to the page.
So I need to change the navigation items.
I found a folder called templates and in that folder is the template.dwt file. I tried copying that file to my desktop, then making the change and uploading back to the ftp site. Of course that had no effect on the nav items. My guess is the file on my desktop does not know to update the other pages as it doesn't know where those pages are.
So how do I go about making the changes to the files on the ftp site using the DWT file?
Do I have to download ALL the html files and the DWT files and somehow create a relationship so when I make the change to the DWT file it updates all the pages on my desktop THEN re-upload all those files back to the ftp site?
Thanks
My guess is that you already figured this out, but just to be sure. You're question is right, the DW template works by when the template is modified (in DW) then you can update all the pages that are linked to it.
If you take the template out of DW and just modify and upload that alone, then nothing will happen to the other pages. So yea, if you know a way to create a link between the template and the other files outside of DW, then that is what you need to do. The other option is using DW and modify the template and then update the other pages, which is done in a semi-automatic way. Semi-automatic, meaning that DW gives the option to update the files either once you save the template or you can save the template and update the files later using DW.
And your guess is correct, the template modifies areas that are not specific to a page. Usually, this is done by creating Editable Regions in the template. Those regions are excluded from change when the template is modified.
You have to create a project in DW and put inside all the files that are "linked" with the template. They usually have tags inside that refer to the template.
Make sure that you keep the same file and folder distribution that the original had. If not, you could have a mess with relative links.
Then, with your template also in the project, open and modify it.
When you save the template, DW will ask you for scan and update related files, if you are lucky it will find and update all of them.

Renaming functions and variables in an original theme

I want to create a theme, using a default WordPress theme as the initial point.
According to WordPress Codex, the recommended way to do that is to create a child theme.
Unfortunately, that approach may noticeably affect the performance of a site, because both themes have to be called before the site is actually displayed. WordPress tends to be fairly slow on quite a number of popular hosts, so slowing it down even further is not something I would want to do.
At the same time, coding a theme from scratch seems to be inefficient when an open source theme is close enough to the desired result to only require certain minor recoding.
Question: if I rename the theme in the main CSS file, there's still a lot of function callbacks and variables addressing the name of the old theme (for example, 'twentyeleven'). There has to be some central location where these are called from. What things do I need to rename, in addition to the theme name at the top of CSS file, to fully rename the entire theme an prevent it from being updated, should the original theme be updated by WordPress development theme?
All functions and callbacks of a theme are only being used if the theme is activated. So if you copy the 'twentyeleven' theme into a new folder & activate it, only those functions are loaded even if they have the same name(s) as the original theme. To answer your question (going with the 'twentyeleven' theme):
Copy the 'twentyeleven' theme folder and give it a unique name
Edit the file style.css in your freshly copied theme folder. Change the Theme Name:, Theme URI:, Theme Author:, Description: & Version: values to match your desired output.
Go to Appearance->Themes and activate your new theme
You have now a 'twentyeleven' clone, but completely independent of the original files. Any updates available for the 'twentyeleven' theme will not affect your theme (there will be no updates listed for your theme).
HTH
you may be interested in html5blank, a boilerplate wordpress theme

JOOMLA, Best way to make alternate layouts for articles?

I can't find a answer for this, I want to know what is the best way to have an alternative layouts for articles in Joomla.
If I understand you correctly you are looking for a way to create additional Alternative Layouts for articles. Under parameter tab "Article Options":
If that is the case, its very close to the other provided answers here. Its just that you got to rename the copied default.php file to something else. If you rename it to custom.php it will end up with the text "custom" like the image above.
Here goes my shot for a step by step:
Find the default layout file(s). You could use the ones provided by the com_content component. They can be found at components/com_content/views/article/tmpl. Copy both default.php and default_links.php.
Now you need to rename and copy the file(s) into a template. The target template can be any of the installed templates. Using beez_20 the new path for the copied file(s) should be templates/beez_20/html/com_content/article/custom.php and templates/beez_20/html/com_content/article/custom_links.php.
Goto to edit article using the backend. Expand the Article Options tab and find Alternative Layout. Select your new layout.
Your template might already provide a article override. If so, you might want to use the files of that template instead (instead of the ones in step 1). So if you are using beez_20, you could copy templates/beez_20/html/com_content/article/default.php and templates/beez_20/html/com_content/article/default_links.php.
Helpful links:
Using Joomla’s Template and Layout Override
Layout overrides in Joomla 1.6
The best way to do this would either to install another content component - such as k2 which is highly customizable. Or any other content component on JED.
Alternatively you could create a template override on the existing Joomla Template. This is preferable to editing the files directly in com_content component as the template overrides will never be overwritten whereas the core files will be in any Joomla Updates. I should add, hopefully unnecessarily that this requires Joomla 1.5, 1.6, 1.7, 2.5 or 3.0 (although this is still in beta as of present). So make sure you're not using 1.0.
To create an alternative layout for the built in articles component the best way to do it is probably to create a template over-ride.
See this article on docs.joomla.org on "How to override the output from the Joomla! core"
Creating an alternative for an article layout is pretty straight forward. You can achieve this by using the core layout override with your published template(s).
First you want to get/copy the core article layout file:
components/com_content/views/article/tmpl/default.php
Then place it into your published template:
templates/YOURTEMPLATE/html/com_content/article/default.php
If the template you are using doesn't have the html folder, then you will have to create that folder and each folder to make that path correct.
Once you have this in place, all you need to do is make changes to that default.php file you have just place in the template and that is it!

Resources