Advice needed on modifying a template
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
-
This may not be the correct way to go about it, but in the ass I have taken designs and modify CSS of a RocketTheme template such that I could make it match the original design. Here is an example of a Rocket theme that was modified and looks nothing like the original. This is using the Clarion template
www.dramelia.com
I have a new design and i want the finished product to be responsive so I am using the Grafitto template. However I'm having a hard time with border and glow. Since there is not a wrapper that encompasses the entire main part of the website I have to do the glow and outlines on each section individually which is forcing me to use z-index but I'm running into issues with that.
Am I going about this all wrong or can someone suggest a different template or perhaps a completely different approach. I am open to any suggestions.
Here is the design I am needing to convert to a website.
This image is hidden for guests.
Please log in or register to see it.
Here is my febal attempt at adapting the design to the template. I did not get too far but if you mess with the width of the browser you will see where it starts to fail.
splitlightdesigns.com/glow/
Many thanks,
Houston - Last Edit: 11 years 9 months ago by Houston.
- Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Hi there,
Just edit the index.php to include a container around all content. Then add styling in mediaqueries less.
If this resolves your problem then please edit your first post in this thread by adding SOLVED at the start of the title and then select the green tick icon. This lets the moderators know that it can be moved to the solved section.
Thanks for your cooperation
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
- Will I not have to edit the index.php file if the template updates?
- Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Yes.
If you want to radically change the way a template functions then you need to consider the future.
It is easier to re-edit the index.php than to fight through loads of css that could ultimately brealk as browsers update.
Choice is yours but I know what I would do :cheesy:
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
- Obviously easier to add the wrapper DIV.
- Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
-
Well, I am having a really hard time trying to figure out where to put the extra div to wrap around the area I I need it to. I have tried it around the whole thing but it puts the borders at the edges of the browser and not the content area.
Any ideas where in the index.php I need to put the extra div to make this work?
Here it is without any borders or glow. splitlightdesigns.com/glow/
Many thanks,
Houston - Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Hi there,
OK - Graffito is a responsive template. I am guessing that you have the template advanced layout set to responsive. Which means that on my 23" screen it will be 1200px wide. Your css for your div is 960px - In effect you have screwed the responsive effect.
If you want 960px then set the template to 960px fixed.
If you want responsive then you will need to rename div class testing to rt-container and add another class such as main. Then you can add decorative css for .rt-container .main
Hope this helps
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
-
I was just testing for and choose 960px, it was not my intention to keep it that way. My intention was to put this into the custom CSS for the template a set of media queries. I was just testing here to see if I could get the border to go around the area I needed it to. So in order to see it correctly, you will need to adjust your browser width such that it jumps to the (min-width: 960px) and (max-width: 1199px).
With that being said the problem I am now having is that my container also wrapped around the bottom of footer when I need the wrapper to actually wrapped around the top of the footer.
This image is hidden for guests.
Please log in or register to see it.
I think I am on the right track but am open to better suggestions.
Many thanks,
Houston - Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- Houston
- Elite Rocketeer
- Posts: 1077
- Thanks: 2
-
After moving the closing div around forin the index.php file, I think I have it figured out. I am going to continue to play with it until i get it right but I think i have it now.
<div class="testing">
If not, should I start a new thread or come back to this one?
Many thanks,
Houston - Houston Brown -
www.splitlightdesigns.com
Apache Version = 2.2.2 / PHP Version = 5.2.17 or 5.3.15 (dual)
mySQL Version = 5.5.21
Joomla Version = 2.5.8 / Web Servers OS Version = CentOS 6
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Hi Houston,
If more assistance required please start new thread in Graffito forum.
Cheers
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
Time to create page: 0.051 seconds