Getting a CSS based Menu into C5- need some expertutolidge!
Permalink
Hey folks,
I am trying to jazz up a navigation bar by using a piece I have done using Dream Weaver. It is essentially a table built using HTML with some quirky CSS to give a bit of a kick.
I have tried to add the block as an HTML through C+P, and it comes up as raw HTML. When I apply the CSS script through the "Design" window, it does not effect the raw HTML and none of the images show up. I have got them all across to my server, so the images are connected.
I attach the URL of the navigation and if some one could point me in the right direction of basically how I drop this into C5, I would be very pleased!
http://www.portobellarain.co.uk/MonkeeMenu/advanced-css-menu.html...
Many thanks in advance.
Ben.
I am trying to jazz up a navigation bar by using a piece I have done using Dream Weaver. It is essentially a table built using HTML with some quirky CSS to give a bit of a kick.
I have tried to add the block as an HTML through C+P, and it comes up as raw HTML. When I apply the CSS script through the "Design" window, it does not effect the raw HTML and none of the images show up. I have got them all across to my server, so the images are connected.
I attach the URL of the navigation and if some one could point me in the right direction of basically how I drop this into C5, I would be very pleased!
http://www.portobellarain.co.uk/MonkeeMenu/advanced-css-menu.html...
Many thanks in advance.
Ben.
If it's coming up as raw HTML, it's probably because you pasted it into the "Content" block -- try using the "HTML" block instead.
Hi Jordan,
This is what I did in the first place, but it has not worked. It just comes in as a table and raw HTML text that has a red rollover feature. A lovely feature if you like that type of thing, but not what I need.
The HTML is driven by the CSS at the link, so just need to find out how I can drop this into my page.
If you have any ideas, please let me know.
:D
This is what I did in the first place, but it has not worked. It just comes in as a table and raw HTML text that has a red rollover feature. A lovely feature if you like that type of thing, but not what I need.
The HTML is driven by the CSS at the link, so just need to find out how I can drop this into my page.
If you have any ideas, please let me know.
:D
I am seeing it just fine!
Hey Revo!
Are you looking at the link? I think you might be. The location I am looking to drop that into is currently being built, so there is no URL to the site. The link does show up yes, but need to know how it can be dropped into my pages and then linked up as cool looking nav bar.
Many thanks,
Ben.
Are you looking at the link? I think you might be. The location I am looking to drop that into is currently being built, so there is no URL to the site. The link does show up yes, but need to know how it can be dropped into my pages and then linked up as cool looking nav bar.
Many thanks,
Ben.
Have you tried to create a custom autonav template?
No, but I will have a look at this option. Thanks, will try this out.
may thanks.
may thanks.
Hey Hey Revo!
Many thanks, this advice took me over to my autonav folder- I already have some CSS in there anyway, so just tweaked it and it worked!
Cool!
Many thanks, this advice took me over to my autonav folder- I already have some CSS in there anyway, so just tweaked it and it worked!
Cool!
Glad to help!
Hi Revo,
I thought I was close, but it was snatched away at the very last minute!
I had the original autonav over the new HTML Block, so when the view.css form was edited, it clicked the HTML block into life. The plan was to get the new one working then delete the original.
On deleting the original autonav, the css disappears in the HTML Block and I am left with raw HTML.
I have added css to the original, this does something to it as the list moves from the center of its block to the left, but the graphics I have in place, do not appear. Would I have to set up another folder with the images in, maybe in the templates folder? Or is there a file I am yet to edit to change the look of the original?
I might be missing something. A brain possibly. :{D
I thought I was close, but it was snatched away at the very last minute!
I had the original autonav over the new HTML Block, so when the view.css form was edited, it clicked the HTML block into life. The plan was to get the new one working then delete the original.
On deleting the original autonav, the css disappears in the HTML Block and I am left with raw HTML.
I have added css to the original, this does something to it as the list moves from the center of its block to the left, but the graphics I have in place, do not appear. Would I have to set up another folder with the images in, maybe in the templates folder? Or is there a file I am yet to edit to change the look of the original?
I might be missing something. A brain possibly. :{D
If you create a images folder inside your template you can pick images from there.
So your template should have:
autonav/templates/your template/images
So your template should have:
autonav/templates/your template/images
This is going to be the way I think- I have got the HTML working, buts its becoming a bit of a pain. I will try this.
Thanks Revo.
Thanks Revo.
hmm possibly some css being applied from the orginal autonav if you copy the offending css your new custom template css, I would also place the images into that template folder
root -> blocks -> autonav -> templates -> custom_name -> images
then in your view.css (within your custom name template) you can just call the images url(images/image_name).
How are you adding the template? a call from a Global scapbook within your theme tamplates/page_types? if so then your css will not be included from your custom_name block theme.
Then I find I have to copy the relevant styles into my main.css
what I mean is
Hope some of that makes sense
Sean
root -> blocks -> autonav -> templates -> custom_name -> images
then in your view.css (within your custom name template) you can just call the images url(images/image_name).
How are you adding the template? a call from a Global scapbook within your theme tamplates/page_types? if so then your css will not be included from your custom_name block theme.
Then I find I have to copy the relevant styles into my main.css
what I mean is
//will not load in the custom theme $block = Block::getByName('header_navigation'); if( $block && $block->bID ) $block->display(); //I do believe you can use $block->display('templates/custom_name'); //Not to sure this actually pulls in the custom css
Hope some of that makes sense
Sean
Thanks Sean,
this does make sense and looks like the way forward. I will let you all know what Happened!
this does make sense and looks like the way forward. I will let you all know what Happened!
#menu { list-style: none; padding: 0; margin: 0; width: 1024px; height: 110px; background: no-repeat; position: relative; } #menu span { display: none; position: absolute; } #menu a { display: block;
Viewing 15 lines of 59 lines. View entire code block.
Here is what the view.css file looks like ((apologies for the amount of code), the directory has been set up in the original template folder named "drop-down menu" for the images, but when the files are ftp'd and the custom template is chosen, it only shows up as raw HTML text. I may be missing something from this code up here or I may need to edit another file to activate the new style. But all suggestions will be welcome.
Ben.
is the actual raw html being displayed?
ie <div class="blah"> Content
It almost sounds like there is something not being closed within php,
like and echo "Something;
<div class="blah" <-- would also get printed as the missing Closing quotation and "?>"
Is the style sheet being loaded in when you view the source code,
should be you theme/template/view.css
This does not sound like the case for a missing style sheet though if you are being shown the raw html and not just a table/content
is it possible to post what you have so far in your view.php?
maybe a rouge element at play
ie <div class="blah"> Content
It almost sounds like there is something not being closed within php,
like and echo "Something;
<div class="blah" <-- would also get printed as the missing Closing quotation and "?>"
Is the style sheet being loaded in when you view the source code,
should be you theme/template/view.css
This does not sound like the case for a missing style sheet though if you are being shown the raw html and not just a table/content
is it possible to post what you have so far in your view.php?
maybe a rouge element at play
I don't know if it will affect anything? but I always use underscores for folder names in concrete they are then converted to spaces when displayed.
I did run a quick test and changed underscore to a space nothing appeared to change? but maybe a possibility?
I did run a quick test and changed underscore to a space nothing appeared to change? but maybe a possibility?
Well, after a few hours of racking my brains, I managed to realise that the original HTML with view.css styling did work when I actually placed the hrefs in the right bracket "#" was a sneaky little fellow that my eyes passed over.
I was placing the page links into another section of the code and it was effecting the movement of the graphics.
I have abandoned the autonav styling and have just stuck with using the HTML table as my navigation bar- so in truth and finally, problem solved.
Many thanks for all of your solutions, they did help me get my head round what was possible and what was beyond my powers as a designer and not full-blooded developer. :D
I was placing the page links into another section of the code and it was effecting the movement of the graphics.
I have abandoned the autonav styling and have just stuck with using the HTML table as my navigation bar- so in truth and finally, problem solved.
Many thanks for all of your solutions, they did help me get my head round what was possible and what was beyond my powers as a designer and not full-blooded developer. :D
I hate those moments :) they happen to me more often then I wish to admit :P
glad you got it sorted though,
the autonav option is a good way to go once you get a little more C5'ed
you are then able to use page attributes to make it customisable.
glad you got it sorted though,
the autonav option is a good way to go once you get a little more C5'ed
you are then able to use page attributes to make it customisable.
