[opencms-dev] New site

Thu Apr 3 20:15:44 CEST 2025

Thanks, Michael.
I did everything you told me without any problems. My question now is how
to change the background color of the header and footer. I want to use hex
colors if possible. For example, I want the header to have a black
background, and I want different, more personalized colors for the footer.

El jue, 3 abr 2025 a la(s) 5:11 a.m., Michael Emmerich via opencms-dev (
opencms-dev at opencms.org) escribió:

> Hello Juan,
>
> ok, here is a "short" introduction how to set up a new site in OpenCms
> using the Mercury template. The tricky thing is not setting up the site
> itself, but to configure the Mercury for its first use.
>
>
> What you need is a running OpenCms installation with the Mercury template
> installed. Some basic knowledge how to drag & drop content elements into a
> page in OpenCms is useful.
>
>
> *1) Create a New Website*
>
> - Go to the launchpad and select the Websites app
>
> - Click on the "New" icon in the toolbar
>
> - Enter the website name (Title), e.g. "MyWebsite" and the Server URL
>
> - Make sure that the "Template" field has
> "/system/modules/alkacon.mercury.template/templates/mercury.jsp" in it
>
> - Click on "Ok" and OpenCms creates the website and the required files.
>
>
> *2) Configure the Website for the use of the Mercury Template*
>
> - Switch to the Explorer view
>
> - Select your newly created website ("MyWebsite") in the site selector
>
> - Edit the file "/.content/.config"
>
> - Chosse
> "/system/modules/alkacon.mercury.template/configuration/mercury.master.xml"
> as the Master Configuration
>
>
> *3) Set up a Mercury Template model*
>
> - Switch to the Sitemap Editor
>
> -Select "Templates" from the sitemap mode selector in the toolbar
>
> -> You now see a "Default Model for site "MySite" under Templates and no
> entry at the Model groups
>
> - Create two model groups by pressing the "plus button":
>
>     -Header: Title and Description set to "Header"
>
>     -Footer: Title and Description set to "Footer"
>
>
> *4) Configure the Header:*
>
> - Click on the "Header" model group
>
> -> You now see an empty page with a read container in it
>
> - Click on "New" in the toolbar then choose "Template elements" under
> "Types"
>
> - Click on "Layout group" and drag & drop "Mercury header with flexible
> layout option" into the red container
>
> -> You now see a green, empty container and an orange message box
>
> - Click on "New" in the toolbar again and chose "Advanced elements" under
> "Types"
>
> - Click on "Dynamic function" and drag & drop "Header configuration" into
> the green container
>
> -> The page will automatically reload and then show up four new containers
> that we will later use to put content elements in our header
>
> - Press "CTRL-E" until you see the message "Switched view: Template
> elements"
>
> - Go to the edit point in the upper right, select settings and choose
> "Reuse elements" for the group type
>
> -> The box on top of the page now says "Reuse Group"
>
>
> *5) Add content elements to the Header*
>
> - Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Link Sequence" in the top right container, this is
> the only place where you can put it
>
> -> This will be the top header links, so you now should simply add some
> Dummy values in there. You can later change them to the real links
>
> - Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Content Section" in the top left container, this is
> the only place where you can put it
>
> -> This will be the Header image and website title, so enter a title and
> an image in this content.
>
> - Click on "New" and choose "Advanced elements" under "Types"
>
> - Drag and Drop a new "Navigation"in one of the other containers.
>
> -> This will add the navigation or the breadcrumb (depending in which of
> the containers you dropped it). Edit the content and give it a title
>
> - Click on "New" and choose "Advanced elements" under "Types"
>
> - Drag and Drop a new "Navigation"in the last remaining containers.
>
> -> This will add the navigation or the breadcrumb (depending in which of
> the containers you dropped it). Edit the content and give it a title
>
> -> We are now done with configuring the header and can return to the
> sitemap
>
>
> *6) Configure the footer*
>
> - In the Sitemap editor, click on "Footer"
>
> -> You now see an empty page with a read container in it
>
> - Click on "New" and select "Template elements"
>
> - Click on "Layout group" and drag & drop the "Mercury footer full"
>
> -> This will now show so two orange containers which we will later use to
> put content elements in our footer
>
> - Press "CTRL-E" until you see the message "Switched view: Template
> elements"
>
> - Go to the edit point in the upper right, select settings and choose
> "Reuse elements" for the group type
>
> -> The box on top of the page now says "Reuse Group"
>
>
> *7) Add content elements to the Footer*
>
> - As the footer is more flexible what ot put in there, we need to add some
> rows first
>
> - Click on "New" and select "Template elements"
>
> - Click on "Layout row" and drag & drop the "Row 1 column (12 -full) into
> the lower container
>
> - Click on "New" and select "Template elements"
>
> - Click on "Layout row" and drag & drop the "Row 3 columns (4-4-4) into
> the upper container
>
> -> You now created the containers for the footer. Usually the three upper
> ones can be used for content sections or link sequences (showing links
> below each other), the lower one is used for some footer links in a link
> section besides each other. For example, you could fill it like this:
>
> - Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Content Section" in the top left container
>
> - Add some text and headline there
>
> Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Content Section" in the top right container
>
> - Add some text and headline there
>
> - Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Link Sequence" in the top middle container,
>
> - Add some dummy links in there
>
> - Click on "New" and choose "Content elements" under "Types"
>
> - Drag and Drop a new "Link Sequence" in the top lower container,
>
> -> This will be the footer links, so you now should simply add some Dummy
> values in there. You can later change them to the real links
>
> - Go to the edit point, select settings and choose "Link sequence page
> element" as the formatter, "in a row" for "Display"
>
> -> We are now done with configuring the footer and can return to the
> sitemap
>
>
> *8) Configure the template model*
>
> - In the Sitemap editor, click on "Default Model for site "My Website"
>
> -> You now see an empty page with a read container in it
>
> - Click on "New" and select "Template elements"
>
> - Click on "Layout area" and drag & drop the "Area - One row" into the page
>
> -> You will now get one new container, this is where you later place your
> rows
>
> - Click on "New" and select "Advanced elements"
>
> - Choose "Model group" and drag & drop the "Header" model group above the
> Layout are from the step before
>
> - Click on "New" and select "Advanced elements"
>
> - Choose "Model group" and drag & drop the "Footer" model group below the
> Layout are from two steps before
>
> -> You now created you Template model which will be used when creating new
> pages
>
>
> *9) Creating new pages:*
>
> -Select "Sitemap" from the sitemap mode selector in the toolbar
>
> - Click on "New" in the toolbar then crag & drop a "Default Model for site
> "MySite" into the sitemap
>
> -> The new page is now called "page", you can rename it by clicking on the
> name.
>
> - Click on the newly created page, it then opens in the page editor,
> including the header and footer you have created.
>
> - Click on "New" and select "Template elements"
>
> - Click on "Layout row" and drag & drop any of the layout rows into the
> orange container. You can add multiple layout rows to build the structure
> of the page you want
>
> HINT: If you always want to use the same row structure, you could also add
> the rows to your Template Model. All pages created with this model will
> have the same row structure, but you still are able to modify it after
> creating a new page
>
> - Click on "New" and select "Content Elements. Select the type of content
> you want to have and drag& drop it in any of the containers in your rows.
>
>
> Please refer to https://mercury-template.opencms.org/ for all the content
> types and how to use or configure them. Please note: The Mercury
> documentation is only available in German, so you need to use the translate
> functions of your browser to get it in English.
>
>
> I hope that I mixed nothing up here, but it should work this way.
>
>
> Kind regards,
>
> Michael
>
>
> Am 02.04.25 um 14:09 schrieb Juan Garrido via opencms-dev:
>
> Hi Miguel
> Thanks for your reply. I want to create a website using the Mercury
> template.
>
> El mié, 2 abr 2025 a la(s) 7:52 a.m., Michael Emmerich via opencms-dev (
> opencms-dev at opencms.org) escribió:
>
>> Hello Diego,
>>
>> > Hi, I'm new to OpenCMS and I'd like to know if you have a guide on how
>> > to create a new site. I've read the documentation and I don't fully
>> > understand it. Is there a step-by-step guide?
>> > Thanks
>>
>> Do you want to create a new site using the Mercury template, or do you
>> want to create a new site that uses a new, custom build template?
>>
>> If you want to use the Mercury template for your site, the "challenge"
>> is to configure it correctly for your use. if you want to use your own
>> one, the thing is to make your template first.
>>
>> If you can say which way you want to do, I could give some advice.
>>
>>
>> Kind regards,
>>
>> Michael
>>
>> --
>> Michael Emmerich
>>
>> Alkacon Software GmbH & Co. KG - The OpenCms Experts
>> http://www.alkacon.com - http://www.opencms.org
>>
>> _______________________________________________
>> This mail is sent to you from the opencms-dev mailing list
>> To change your list options, or to unsubscribe from the list, please visit
>> https://lists.opencms.org/mailman/listinfo/opencms-dev
>>
>>
>>
>>
> _______________________________________________
> This mail is sent to you from the opencms-dev mailing list
> To change your list options, or to unsubscribe from the list, please visithttps://lists.opencms.org/mailman/listinfo/opencms-dev
>
>
>  --
> Michael Emmerich
>
>
> Alkacon Software GmbH & Co. KG - The OpenCms Expertshttp://www.alkacon.com - http://www.opencms.org
>
> _______________________________________________
> This mail is sent to you from the opencms-dev mailing list
> To change your list options, or to unsubscribe from the list, please visit
> https://lists.opencms.org/mailman/listinfo/opencms-dev
>
>
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20250403/17abdd1e/attachment.htm>