[opencms-dev] How to create new websites?

Michael Emmerich m.emmerich at alkacon.com
Wed Oct 4 09:10:58 CEST 2023


Hello Atle Enerson,

here is a short summary how to set up your own site with your own 
template in OpenCms. Lets assume that you have a recent installation of 
OpenCms 15 or 16 with the Mercury demo up and running. Those would be 
the steps to make your own site with a VERY simply template. Also, take 
a look at https://documentation.opencms.org/central/ for the 
documentation and taglibs.

Here we go:

- Create your own module like "org.enersen.core". When creating, make 
sure that you created the folders "formatters", "i18n", "resources", 
"schemas" and "templates" in it. If you have not done this when creating 
the nodule, simply create those folders under 
"/system/modules/org.enersen.core"

- Now create a template in 
"/system/modules/org.enersen.core/templates/": Create a new file of the 
type "Page template" which is found under "Configurations" in the new 
dialog. Name the new file "template.jsp" (or any other name you like).

- Open it for editing and paste the following in it. This is the basic 
skeleton for a very simple template, creating one container there you 
can later put in your content elements:


<%@page pageEncoding="UTF-8" buffer="none" session="false" 
trimDirectiveWhitespaces="true"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms"%>
<!DOCTYPE html>
<html>

<head>
*<cms:enable-ade />*
</head>

<body>

<c:if test="${cms.isEditMode}">
<div style="margin-top:60px">
</div>
</c:if>

<div>
<p>
This is above the container.
</p>
</div>

<div>
*
**<cms:container name="main" type="content">**
**<div style="background-color:#F5A9A9; padding:20px">**
**Container: Pull content elements in here.**
**</div>**
**</cms:container>*

</div>

<div>
<p>
This is below the container.
</p>
</div>

</body>
</html>


- The interesting parts are highlights in the code: <cms: enable-ade> 
enables the ui functions in the template, so that you can drag&drop some 
contents in it. <cms:container> defines the container, i.e. the 
placeholder where your contents can be pulled into. The "name" attribute 
must be unique, every container has its own name. The "type" attribute 
defines the type of the container, this is used to define which kind of 
content elements can be pulled in here.

- Now we need a content that can be pulled in there. So we must define 
one first:

- Go to the launch pad, select resource types and create a new one in 
there. First, you must select a module where this type i defined in, 
there you should select your own module "org.enerson.com".  In the 
dialog, you must define the name of the content type, e.g. "mycontent". 
The xpath element name, e.g. "MyContent" (must start with a capital 
letter), the display type name (the "nice" name, shown in the UI) and a 
description. All the rest can stay the same right now.

- If you click ok, a demo schema for the content is created, a demo 
formatter and its config is created and the new type is registered in 
the system. Once everything is created, you can of course modify the 
schema to have other content fields in it and modify the formatter. But 
right now, we stay with the example that was created.

- The only thing we change now is in the created formatter config 
/system/modules/org.enerson.com/fomratters/mycontent.xml. Open it and 
remove the  value for "Container pixel with" with the scissor symbol. 
Instead press the "+" on "Matching containers", select "Container types" 
and enter "content" as the container type. Remember the template above 
where we had defined a container of the type "content"? We just matched 
our formatter that this one can be pulled into the container in the 
template.

-Finally, we can create a new site. Use it as you had it on your 
screenshot, just select your own template in there which is now 
available in the drop down. The system then creates the basic structure 
and files for your site.

- Use the site selector to switch to your new site "1408" and click on 
the index html in there. You will now see your template with a red 
placeholder where you can pull in your content. Use the new wizard and 
drag & drop the content type "mycontent" in the red place holder and 
edit it.

- The new wizard also shows all content type of the Mercury demo, but 
they cannot be pulled into your template as they do not math the 
container in it. Of course you can configure your system that those 
contents do not appear in your site, but I just wanted to stick to the 
basic steps here.


Hope this helps.

Kind regards,

Michael

Am 03.10.23 um 19:13 schrieb Atle Enersen via opencms-dev:
>
> First of all concgrats om 16.0 😊
>
> Now down to business. I need (want) to make a new website. To get that 
> going I neewd a new module (let’s call it org.enersen.core. These are 
> some of the modules.
>
> But when I try to save a new WEB-site it does not get saved.
>
> Et bilde som inneholder tekst, skjermbilde, programvare, display 
> Automatisk generert beskrivelse
>
> In Template I can use blamk or this one checked now.
>
> Anyone have any ideas? And pardon my bad english, I do try 😊
>
> Vennlig hilsen Atle Enersen
>
> --
>
> Tel.: +47 48063171
>
> X/Twitter: @nesrene
>
>
> _______________________________________________
> 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
>
>
>
-- 
Michael Emmerich
  
-------------------
Alkacon Software GmbH & Co. KG - The OpenCms Experts
http://www.alkacon.com  -http://www.opencms.org  
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20231004/3a0c715d/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image001.png
Type: image/png
Size: 29121 bytes
Desc: not available
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20231004/3a0c715d/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image002.png
Type: image/png
Size: 52026 bytes
Desc: not available
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20231004/3a0c715d/attachment-0001.png>


More information about the opencms-dev mailing list