Adding A Theme (the reoccurring question)

Permalink
Hello, I created a very simple design for a website. I am a designer very familiar with xhtml/CSS but I am not at all familiar with PHP.
I created a demo account, I downloaded the supplementary "concrete5.2.ORC2" folder. I closely followed the introductory video about adding themes to Concrete 5...I log into my demo Dashboard and voila, nothing appears.

Below is my very simple code (pardon my french). In my CSS I have some background images, some link attributes. Nothing complex. These are all in the same folder inside of the "themes" folder. My folders are practically the same as the video except for some differences in names.

The rest underneath the introductory video concerning codes and names ("code recap") is utterly incomprehensible for a PHP noobie like myself... perhaps this is what is preventing my theme from appearing...

Thanks,
Sarah

*******
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>bienvenue</title>
<link href="<?=$this->getThemePath()?>/default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!------ debut de contenu ------>
<div id="conteneur">
<!------ debut de haut ------>
  <div id="haut">
  <h1><a href="home.html" target="_self">LOGO</a></h1>
  </div>
<!------ fin de haut ------>

 
flywithhim replied on at Permalink Reply
flywithhim
I have been creating my own C5 theme too, with minimal knowledge of php. What helped me was to download a working theme, or take the default theme, and simply copy and paste code that seemed relevant. The demo did not help me, unfortunately. I am not sure what you are referring to when you said that nothing appeared on Dashboard, but it was most helpful to me to learn from a working theme.
cali replied on at Permalink Reply
cali
for french help you can go there (if you prefer to speak french):
http://www.concrete5.fr

instead for exemple you can copy the /concrete/themes/default one you'll have also a very simple one to let you trainning on.

after you've just have to upload your template folder in the /themes folder on you're site root. When you'll go to the theme page in the dashboard you should have it to add.
dstew99 replied on at Permalink Reply
dstew99
Is the page loading and just not the css?

The code you have shows that you are using
PHP 'short' tags. Short tags are not always enabled on servers.

Try changing:
<?=$this->getThemePath()?>

To:
<?php $this->getThemePath(); ?>


Also, of course, you need to go to the dashboard and install the theme. The main theme file needs to be called default.php

I hope this helps,
dave

(by the way, reoccurring is not a word, it's recurring.)
Rosie replied on at Permalink Reply
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>bienvenue</title>
<link href="<?php $this->getThemePath(); ?>/default.css" rel="stylesheet" type="text/css" />
</head>


Did I write "reoccuring" somewhere? God forbid. Anyhow, I tried changing the code as suggested by dstew, I tried changing the path as suggested by cali (ex./themes/halloween/default.css) and when I log into my demo account and go to "Pages and Themes" I've got the same old Plain Yogurt and Green Salad. In the video, it seems that my new theme would just *poof* appear automatically. I don't see any type of "install" function in "Pages and Themes." I am on a demo account...is this posing a problem? As flywithhim suggested, I may just resort to working within the very uninspiring confines of Yogurt and Salad.
frz replied on at Permalink Reply
frz
If you are using a demo account on getConcrete5.com, you don't have access to the file system. We don't give away FTP rights on demo accounts for obvious reasons.

Once you've made a theme, its gotta actually be in the same place as the rest of the concrete5 install..

It sounds like you've downloaded the core from sourceforge and are messing with it on your local computer, which is great. See if you can get to your theme locally if thats the case..

You're not going to be able to add a new theme to a demo account, because we dont let you get in to put the files into the directory they need to be in..

I apologize if I've completely missed the point, it just read weird to me so i wanted to be sure we were talking about the same thing.
Rosie replied on at Permalink Reply
...for being "weird" and excuse my "messing around.". Before investing in cocrete5, i just wanted to know how difficult or easy it would be to accomplish my main goal: adding my own designs. I know nothing about php and i presume that you are marketing your service to people like me. And yet the tutorials often lead me to blank links, the videos are barely legible, and often seemingly apart of a series of videos but the location of the other vidéos is a mystery. Improve this aspect of your service and you'll convince me to pay you.
frz replied on at Permalink Reply
frz
forgive me Rosie, I think you've misinterpreted my intended tone.

I certainly didn't mean to imply you were "weird" or that you shouldn't be "messing around." I meant as I read your message I couldn't figure out if you were putting theme files locally on your computer or up on a remote server. Once I learned you were using our demo, I knew you couldn't be putting them up on a server. I said "it read weird to me so I wanted to be sure.." Perhaps "odd" would be a better word? Neither is meant as an insult.

Here's what I know.

1) No. We're not selling our services to you. We'd be happy to host your site, but we're certainly not going to build or implement your templates for you. There may be other folks on here who would, but that's not what my staff is doing. We want more people to be able to easily communicate online, so we gave away concrete5. There's no scheme here.

2) We gave concrete5 away for free 6 months ago. I agree it'd be super if there wasn't a single broken link on our site and our documentation was perfectly detailed. Neither is true because for various reasons, not the least of which is we're half a dozen people sitting in basements working for nothing.

3) We are constantly improving our documentation as we're very much aware that it lags far behind the app. Part of the reason there are broken links there now is because we just reorganized the whole site and are still cleaning house. A whole bunch of new material just went up today (Saturday) but I confess it's pretty developer centric so I'm not sure it's going to help.

4) I maintain that the problem here is simple. You're making template files locally, and then looking at a demo remotely on getConcrete5.com wondering where they are. Your theme files are going to need to exist in the same install as the site you're looking at. That's all i meant to ask in my post, and I'm still not sure we're communicating about that now.

5) I like the number 5 so i figured I'd say something here, but I'm really just making it up at this point..

Any rate.. no need to pay me, I'm happy to keep trying to help for free.
g'luck
-frz
brianhayes replied on at Permalink Reply
Sarah,
I read your comments and went elsewhere because I too could not fathom the instructions. However I returned and eventually worked out what to do.

To load an existing set of files – eg: a complete website including CSS files, javascript and php functions you can proceed along the following lines. C5 calls these files a “Theme” so I will use the term

1. Download and install Concrete5 following the instructions to create the database. The instructions here are OK. If you can’t follow them I don’t think anything I say will help. I loaded my C5 files intohttp://www.mysite.com/dev/. This path is important.

2. Load your Theme into the folderhttp://www.mysite.com/dev/themes/yourname/... as the video tells you, where of course yourname is an identity you have chosen. The yourname directory will now contain, for example, css directory /files, script directory/files and image directory/files and so forth

3. Create description.txt and file it in the yourname directory – the file will contain two lines, the first being yourname and the second whatever description you give your Theme.

4. Create a .png image of 120 x 90 pixels called thumbnail.png and file it in the yourname directory.

5. Rename the index file, e.g. index.php or index.html, in the yourname directory as default.php.

The above of course repeats the video. You now need to prepare default.php using the code that in my case I had to extract from the examples.

6. In no particular order, in default.php

a. Find the meta tags, the <title></title> , <meta name="keywords" content="”> and <meta name="description" content=" "> tags.
Delete them and substitute

<? Loader::element('header_required'); ?>

This snippet of php code calls up the meta tag information that you will later insert.

b. Find the line in your header that provides the relative link to your css file. It will look something like this:

<link rel="stylesheet" type="text/css" href="/css/styles.css" />

Then insert the code

<?=$this->getThemePath()?>

as follows:

<link rel="stylesheet" type="text/css" href="<?=$this->getThemePath()?>/css/styles.css" />

making sure that there is a (/) after <?=$this->getThemePath()?>

c. Now do the same for all relative paths to images , script files and the like. You can probably find them all by searching “href” but in each case you need to insert the <?=$this->getThemePath()?> code to get C5 to recognise the image or script file that you want to call.

d. For background images go into your CSS files and change all the paths to the background images. For example in the unaltered file the command might look like this

background-image: url(/images/background-image.png);

this code would need to be changed to

“background-image: url(/dev/themes/images/background-image.png);”

or, if you prefer a fully qualified path, change it to

background-image: url(http://www.yoursite.com/dev/themes/images/background-image.png);

Of course you can find all the commands to change by searching on “url”

e. Now find an area you want to make editable. It is best to pick an area with an easily identifiable div. For example the div might be

<div id=”introduction” >
<h1>Introduction</h1>
<p> A certain amount of introductory text, blah blah blah </p>
</div>

Cut and save the HTML : -

<h1>Introduction</h1>
<p> A certain amount of introductory text, blah blah blah </p>

and file it in say a notepad file. Then substitute

<? $a = new Area('Introduction'); $a->display($c); ?>

Or
<? $a = new Area('someothername'); $a->display($c); ?>

where “Introduction “ or “someothername” is a unique name you are giving to this area.

You have nearly finished the preparation of the file. The last step is to insert the sign in link as unobtrusively as possible at the bottom of the page. The code is

<div id="signin">

<a href="<?=$this->url('/login')?>"><?=t('Sign In ')?></a>

</div>

7. The div “signin” of course can be any div you like

8. That’s just about it for the preparation of the files. Go into the admin panel now and follow instruction to load your theme. I found all this fairly clear. Then go to the theme itself and start editing the editable area you created. Click on Edit page, click on the area, and when you are invited to add a block add ”content”. You will find that this content block has an HTML button – go into it, load the html you saved in the notepad and follow instructions to exit and save. Hey presto the result will be exactly the same as the original.

9. To insert the meta tag information go to the dashboard, then sitemap, then properties of each file and you will find boxes to insert the title description and keywords.

10. To create new pages etc follow instructions in the dash board. They are reasonably clear and /or intuitive.

11. Last point. You cannot put any php snippets into the editable areas. Alas.
However the blocks inserting forms work rather well so it might not be necessary.

All this took me quite some time to work out but it’s basic stuff. Maybe I am stupid. Once its all mastered it’s a great programme. If I had had the above instructions I would have given a very enthusiastic endorsement. Please note there are probably errors in this but you should be able to get the idea.

Brianhayes
bcarone replied on at Permalink Reply
bcarone
Brian great post. You should be recruited as a Tech Writer :)

I am saving your post for future inclusion of my tutorial for clients (they will have more stuff but they are paying for it) but I will submit it to the team and if they like it, I hope they publish it.

Great Post Brian!!!

Bill
bcarone replied on at Permalink Reply
bcarone
Brian great post. You should be recruited as a Tech Writer :)

I am saving your post for future inclusion of my tutorial for clients (they will have more stuff but they are paying for it) but I will submit it to the team and if they like it, I hope they publish it.

Great Post Brian!!!

Bill
bcarone replied on at Permalink Reply
bcarone
Brian great post. You should be recruited as a Tech Writer :)

I am saving your post for future inclusion of my tutorial for clients (they will have more stuff but they are paying for it) but I will submit it to the team and if they like it, I hope they publish it.

Great Post Brian!!!

Bill
frz replied on at Permalink Reply
frz
Here's some flair.

More importantly, here's your article in help:
http://www.concrete5.org/index.php?cID=6787...

and you should have admin/edit rights on that page as well!

thanks.
-frz