Fork me on GitHub
Reply New Topic
2017/10/10 10:11:38
#1
Offline
Not too shy to talk

ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

1) are themes PHP in all cases nowadays? if not, someone fiddles with my programmes, they show in PHP ($-signs etc)... I have been able to get them in slightly more readble (for me, user) listings re-showing as source in mozilla. 2) I try iTheme but cannot get CcolL to widen above 170 ( across centerline and narrow'ing the two right cols). Can I get that center left col to grow right? (boot-strap doesnt help me... didn't understand it actually) 3) Is there any 4col theme design where cols can divide like ~ 20 – 40 – 25 – 15 % … with basic traits? (html, not php?) 4) Have U seen that stupid around who kicked Marc-André Lanciaux? 5) can themes now be installed by lever in admin GUI? Is there a wiki /docu for using that? tag /search word? I'm the GNU /GPL supporter, early pirate member and now green party 100% democrate. I have seen you around since 7-9 years or somthi'n. I think you know Greetings!


2017/10/10 17:40:39
#2
Offline
Home away from home

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

The symbols you most likely are seeing are the Smarty variables, which enables dynamic content for your pages. A theme consists of both HTML and PHP, along with JS and CSS. An overview was written some time ago about themes and templates.

If you have an example of the layout you are trying to achieve, I'm sure someone can assist with developing or customizing a theme for you.


_________________

Steve Twitter: @skenow Facebook: Steve Kenow


2017/10/11 9:07:33
#3
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

3) Is there any 4col theme design where cols can divide like ~ 20 – 40 – 25 – 15 % … with basic traits? I have made changes to iTheme layout.html (was it?) .... and have made proper (i hope) arrangements ... but it doesn't take effekt. I saw that there is nice documentation to templates install. godhetsuppdraget.org


2017/10/11 14:16:20
#4
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

I theme is quite rigid when it comes to the major layout,but I will have a go at it tomorrow too se if I can get the column distribution you want. Another option would be to look at the bootstrap theme. It is basic in the colors and the design, but it is flexible, responsive and mobile ready. I will try both the themes to get them like you asked

_________________

Me on Ohloh


2017/10/13 13:56:04
#5
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

ok, so I didn't get iTheme to work the way I thought it would... I'm looking at a more modern bootstrap-based minimal theme, that can easily be themed further once it is ok.


_________________

Me on Ohloh


2017/11/24 7:36:57
#6
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

what is the trick w the JS? ... what's being done in themes with that? (it prohibit most amateurs from using it) w#


2017/11/28 1:19:01
#7
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

In Bootstrap, Javascript is used for a few functionalities that are difficult or impossible to do with CSS only, such as the tabs and some other parts as well (look at the Bootstrap 3.3 Javascript documentation to get an overview).

ImpressCMS also uses some javascript for admin users, for example to give you the pop-up windows when you want to edit a block on the frontend.

Some modules use Javascript, but that's totally up to them.

 


_________________

Me on Ohloh


2017/12/6 11:42:08
#8
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Was it ordinary community koncensus descission to make /use? 1) JS in such scale? 2) To arrange the Template Set Manager according to 1.3.10 ? I find it strange that someone doubled the need for knowledge (JS) AND also arranged the Templ.SM with ~100 css /html design "names" that no one can know from before... .----------------------- Is this community according to your oppinion fiammybe under some kind of hostile "overtake" ??? If, Do you then know who it is, alias or true name? Greetings! ........... justa# /walking# /(xoops MrGrey).


2017/12/7 4:47:04
#9
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Hi, 

those are choices by the theme developer and, ultimately, by the site owner that decides to use that particular theme.

Bootstrap is the most widely-used CSS framework at the moment, which makes it a good platform to use if you want to create themes. By using bootstrap, you accept that certain functionality in the theme will be offered by some Javascript. Some time ago we had a look at what was available with the developers at that moment, and we decided on using Bootstrap for hte newer versions of ImpressCMS. No hostile overtaking, but simply pragmatic team members

There are other frameworks around, but personally I haven't used them and some of the functionalities that are requested nowadays by the end-user can only be done in Javascript so there isn't a realistic way to write modern themes without it.

As far as I know, there were no changes made tot he Template manager in the last versions. To be honest, I think the only use for the template manager is to fix some small issues in the template of the theme you are using, but in order to make the template manager useful in that scenario, there is some work to be done. The template manager is not integrated with the themes at the moment, and as such it can't offer you the option to download the template set for a specific theme. I think that would be interesting, but it isn't a big priority at the moment.


_________________

Me on Ohloh


2017/12/12 19:18:53
#10
Offline
Home away from home

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

I think Bootstrap is a good choice. The 12-column grid is very flexible and a lot less painful than fiddling around with percentages once you get used to it. Also great for making a site mobile friendly. There is very little Javascript required if you just want to mess with a Bootstrap theme, mainly it's just assigning Bootstrap CSS classes to your existing HTML. I've been moving away from multi-column layouts recently. Even with Bootstrap the less columns you have the easier things are to adapt to a mobile display. There's quite a few good (really outstanding) free themes available for Bootstrap (though the page/file size runs pretty high on some of them). I found them pretty easy to adapt for my other project, although I haven't tried it on ICMS yet it shouldn't be too hard. Good free Bootstrap theme sites include: BlacktTie: http://blacktie.co Start Bootstrap: https://startbootstrap.com/ Get Bootstrap: http://getbootstrap.com/getting-started/ By the way, I still can't find a way to have line breaks in my posts. If I preview the post (first time) it looks fine, but it ends up with no breaks.


2017/12/14 5:29:59
#11
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Thank you for the pointers Madfish. The abundance of available material for Bootstrap is one of the reasons for picking it, next to the reason that we don't want the burden of having to define a CSS framework ourselves. That's not our core business in a way.

I'm puzzled concerning your inability to send line breaks, I'll have a look at the differences in our profiles.


_________________

Me on Ohloh


2017/12/25 11:54:43
#12
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Q: My intention is to have entrance page 4col and other pages 3col. ...then my question... Must then theme.html (1.3.10) contain both column set-ups + all css data ? ... or can I use 1 page theme.html 4col AND 1 page theme.html 3col somehow? (I believe each page is simple to make when getting to know the grid principle). theme1.html theme2.html ? ... but I cant find a "users way" to call those... Solutions, pls! Merry Christmas and a happy new year! #wn/jn .------------ (if allways using a simple 12col grid it would be possible to make all themes according to a few made up css (originals). Like choosing shoes to your suite.) Can Template Manager be a module?


2017/12/29 11:57:11
#13
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Need either docu OR help with the theme in bootstr 303 to adopt to 4col + 3col. Pls help!


2017/12/31 3:37:41
#14
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Hi,

the way the themes are currently setup is that the theme.html file contains the basic layout for the entire site. What you want is possible, but it will require some inventive smarty coding I think.

Bootstrap is very interesting to use because it takes care of most of the basics for responsive design. What you need to decide is how you want those 3 and 4 columns to show up on a mobile device. The reason is that this choice will impact how the HTML of the theme.html is structured

For example, if you just want the content of the 4 columns to be shown one below the other, you define your main content zone as col-sx-3. Bootstrap takes your content and puts it ont he page in the order in which it is transmitted in the HTML file. So it is not easy to show the content of column 1 and 3 first, and then the content of column 4 and then column 2. Also, i wouldn't display more than 1 column on a smarphone, to keep it readable.

Can you tell me what pages you would need to have 3 and what pages will need 4 columns? Also, which modules do you plan to use on those pages? This kind of design implicates adapted templates specifically made for the modules that you use ( like we do on the ImpressCMS site itself for example).


_________________

Me on Ohloh


2018/1/1 4:08:38
#15
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

@ fiammybe: (pls recieve this and erase here). Marigins close to 0. ... site entrance 4col and rest 3col.... I get back. (uploaded pic)


2018/1/7 14:39:20
#16
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Hi, the basic Bootstrap 3.3.7 theme will be delayed a few days, see here


_________________

Me on Ohloh


2018/1/18 7:38:15
#17
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

This is the Bootstr. 303 I have in theme.html, is this right? <{assign var=theme_name value=$xoTheme->folderName}> <{assign var=theme_name value=$xoTheme->folderName|cat:'/templates'}> <{if $icms_pagetitle !=''}><{$icms_pagetitle}> : <{/if}><{$icms_sitename}> <{$icms_module_header}> <{if $xoBlocks.canvas_left and $xoBlocks.canvas_right}> <{assign var=columns_layout value='col-md-6'}> <{assign var=block_layout value='col-md-6'}> <{elseif $xoBlocks.canvas_left or $xoBlocks.canvas_right}> <{assign var=columns_layout value='col-md-9'}> <{assign var=block_layout value='col-md-6'}> <{else}> <{assign var=columns_layout value='col-md-12'}> <{assign var=block_layout value='col-md-6'}> <{/if}>
<{$icms_slogan}>
<{if $xoBlocks.slider}> <{include file="$theme_name/slider.html"}> <{/if}>
<{if $xoBlocks.canvas_left}>
<{foreach item=block from=$xoBlocks.canvas_left}>

<{$block.title}>

<{$block.content}>
<{/foreach}>
<{/if}>
<{if $xoBlocks.page_topcenter}> <{foreach item=block from=$xoBlocks.page_topcenter}>

<{$block.title}>

<{$block.content}>
<{/foreach}> <{/if}> <{if $xoBlocks.page_topleft or $xoBlocks.page_topright}>
<{foreach item=block from=$xoBlocks.page_topleft}>

<{$block.title}>

<{$block.content}>
<{/foreach}> <{foreach item=block from=$xoBlocks.page_topright}>

<{$block.title}>

<{$block.content}>
<{/foreach}>
<{/if}> <{if $icms_contents}>
<{$icms_contents}>
<{/if}> <{if $xoBlocks.page_bottomcenter}> <{foreach item=block from=$xoBlocks.page_bottomcenter}>

<{$block.title}>

<{$block.content}>
<{/foreach}> <{/if}> <{if $xoBlocks.page_bottomleft or $xoBlocks.page_bottomright}>
<{foreach item=block from=$xoBlocks.page_bottomleft}>

<{$block.title}>

<{$block.content}>
<{/foreach}> <{foreach item=block from=$xoBlocks.page_bottomright}>

<{$block.title}>

<{$block.content}>
<{/foreach}>
<{/if}>
<{if $xoBlocks.canvas_right or $xoBlocks.tabs or $xoBlocks.accordion or $xoBlocks.menu}>
<{if $xoBlocks.tabs}> <{include file="$theme_name/tabs.html"}> <{/if}> <{if $xoBlocks.accordion}> <{include file="$theme_name/accordion.html"}> <{/if}> <{if $xoBlocks.menu}> <{include file="$theme_name/menu.html"}> <{/if}>
<{foreach item=block from=$xoBlocks.canvas_right}>

<{$block.title}>

<{$block.content}>
<{/foreach}>
<{/if}>
<{if $xoBlocks.prefoot}>
<{foreach item=block from=$xoBlocks.prefoot}>

<{$block.title}>

<{$block.content}>
<{/foreach}>
<{/if}>

<{$smarty.const.THEME_UPTOP}>

<{$icms_footer}>

// // perhaps it should look more easy then this?


Edited by Walkingnumber on 2018/1/18 8:27:07

2018/1/18 14:12:25
#18
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Not really. If you want to have different zones where you can put blocks, and you want to be able to put multiple blocks in a zone, and you want a header and a footer, that's more or less what you need as a basis.

I chose to keep it all flat in one file, just for clarity. I might split that up in the next version, to make it more readable (even though the HTML that gets produced to send to the browser will be the same)


_________________

Me on Ohloh


2018/1/19 4:32:41
#19
Offline
Not too shy to talk

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Is this called html? <--.--> I can't see any html... nothing ever mentioned in my book (html for dummies) anyway. Earlier I could use ImpressCMS themes, even make them, but not now. <--.--> So what would you recomend now when a poor, simple user (me) only with some earlier experience of static html can not make a simple theme that reaches abow WP? <--.--> Generic stuff is interesting to learn, but this? ... I cannot find this being generic enough to learn as an ordinary user. // walk#


2018/1/20 6:38:33
#20
Offline
Webmaster

Re: ImpressCMS 4-col themes for dummies (me) - basics and install in 1.3.10

Have a look at iTheme, our old and long-lasting default theme. You will see that the same type of syntax is used. ImpressCMS themes are built using the Smarty 2 Theme engine, which allows us to keep php code out of our HTML templates. Note, they are HTML templates, not simple HTML files. When you open this in a browser, it won't work because Smarty needs to fill in the gaps

In a way, what smarty does is add placeholders to a HTML file that get filled up by ImpressCMS. There is a certain logic also (foreach loops and if/then/else constructions) because we need to generate other code based upon certain conditions. For example when a zone does not contain any blocks, the HTML to define that zone should not be generated. 

This is based on the basic HTML5 + CSS template that exists for Bootstrap, we just added the logic to integrate the different blocks and the zones in there. @skenow mentioned a Impressmizing tutorial written some time ago that seems to have disappeared from the site, I will review it to see if it is still in line with the current way things are done and I'll post it before monday.


_________________

Me on Ohloh


Reply New Topic extras
 Previous Topic   Next Topic
You can view topic.
You can start a new topic.
You can reply to posts.
You cannot edit your posts.
You cannot delete your posts.
You cannot add new polls.
You cannot vote in polls.
You cannot attach files to posts.
You can post without approval.