im new to Umbraco now i need to migrate my code..im not sure where to add my code and css to Umbraco..im using Umbraco 3...can anyone show some lights here...
here is my code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
I got to ask...Umbraco 3? Is this because it's an installation you have taken over that has been done by someone else? I don't assume this is a fresh installation?
Before we go into details it would be nice if you could share a bit more background information since it will make it much easy to give you the proper advice on what to do and how to do it :)
i need to add a drop down menu list in one of my page...the page to add my drop down list has been created..since im new to umbraco i need to add a dropdown list to the page that was created..i try to add css style sheet and javascript to my code.....example when a customer click the tittle. the dropdown list display shows wat the customer wants...i want my drop down list to be like this.. im not sure where to add my css and script since the page to add my dropdown has already been created..
Ok, so this is an existing installation based on Umbraco 3 that you need to modify to have the mentioned menu. Is that correctly understood?
What you need to figure out is where does the current navigation exist? Does this need to be modified or do you need to add a completely other menu structure.
It's a bit hard to give advice since I don't know how this solution has been setup. Usually I collect my javascript and CSS files in a folder called "frontend" where I then have subfolders.
But perhaps there already is an existing convention made by the former developer? Do you have access to a local development environment so you can do some trial and error to figure out how the solution has been structured?
I'm guessing that CSS files are placed in the "CSS" folder inside of Umbraco and that javascript is placed in the "Scripts" folder.
Since it's Umbraco 3 the navigation can be made up either using XSLT or Usercontrol. Inside the Umbraco backoffice you can go to the "Developer" section and expand the "Macroes" folder to see what macroes exist - Perhaps one or more has been titled something with "navigation". You can then click on the macro to see if it's based on XSLT or User controls.
Feel free to post the code from the navigation in here so we can give you further advice. If the site is live you could also show us a link to the site.
this is Umbraco 3.0.5...i need to modify that page to add on my drop down list menu...A former developer create the site since im new i need to add some maintenance to the site. i have access to all the page...the page is based on XSLT..the name of my page is "Product" under product i need to edit the Computing page my macros in Developer section looks like this image below
Add html and Javascript code in my Umbraco
Hi
im new to Umbraco now i need to migrate my code..im not sure where to add my code and css to Umbraco..im using Umbraco 3...can anyone show some lights here...
here is my code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="ddaccordion.js">
</script>
<script type="text/javascript">
ddaccordion.init({
headerclass: "submenuheader",
contentclass: "submenu",
revealtype: "click",
mouseoverdelay: 200,
collapseprev: true,
defaultexpanded: [],
onemustopen: false,
animatedefault: false,
persiststate: true,
toggleclass: ["", ""],
togglehtml: ["suffix",
animatespeed: "fast",
oninit:function(headers, expandedindices){
},
onopenclose:function(header, index, state, isuseractivated
{
//do nothing
}
})
</script>
<style type="text/css">
.glossymenu{
margin: 5px 0;
padding: 0;
width: 170px; /*width of menu*/
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}
.glossymenu a.menuitem{
background: black url(glossyback.gif) repeat-x bottom left;
font: bold 14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: white;
}
.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 5px;
border: none;
}
.glossymenu a.menuitem:hover{
background-image: url(glossyback2.gif);
}
.glossymenu div.submenu{ /*DIV that contains each sub menu*/
background: white;
}
.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
}
.glossymenu div.submenu ul li{
border-bottom: 1px solid blue;
}
.glossymenu div.submenu ul li a{
display: block;
font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: black;
text-decoration: none;
padding: 2px 0;
padding-left: 10px;
}
.glossymenu div.submenu ul li a:hover{
background: #DFDCCB;
colorz: white;
}
</style>
</head>
<body>
<div class="glossymenu">
<a class="menuitem" href="">Products</a>
<a class="menuitem submenuheader" href="" >CSS Examples</a>
<div class="submenu">
<ul>
<li><a href="">Horizontal CSS Menus</a></li>
<li><a href="">Vertical CSS Menus</a></li>
<li><a href="">Image CSS</a></li>
<li><a href="">Form CSS</a></li>
<li><a href="">DIVs and containers</a></li>
<li><a href="">Links & Buttons</a></li>
<li><a href="">Other</a></li>
<li><a href="">Browse All</a></li>
</ul>
</div>
<a class="menuitem" href="">JavaScript Reference</a>
<a class="menuitem" href="">DOM Reference</a>
<a class="menuitem submenuheader" href="">CSS Drive</a>
<div class="submenu">
<ul>
<li><a href="">CSS Gallery</a></li>
<li><a href="">Menu Gallery</a></li>
<li><a href="">Web Design News</a></li>
<li><a href="">CSS Examples</a></li>
<li><a href="">CSS Compressor</a></li>
<li><a href="">CSS Forums</a></li>
</ul>
<img src="http://i27.tinypic.com/sy7295.gif" style="margin: 10px 5px" />
</div>
<a class="menuitem" href="" style="border-bottom-width: 0">Coding Forums</a>
</div>
</body>
</html>
thanks
Hi Vadz
I got to ask...Umbraco 3? Is this because it's an installation you have taken over that has been done by someone else? I don't assume this is a fresh installation?
Before we go into details it would be nice if you could share a bit more background information since it will make it much easy to give you the proper advice on what to do and how to do it :)
/Jan
thanks Jan for your reply
i need to add a drop down menu list in one of my page...the page to add my drop down list has been created..since im new to umbraco i need to add a dropdown list to the page that was created..i try to add css style sheet and javascript to my code.....example when a customer click the tittle. the dropdown list display shows wat the customer wants...i want my drop down list to be like this.. im not sure where to add my css and script since the page to add my dropdown has already been created..
thnaks in advance
Hi Vadz
Ok, so this is an existing installation based on Umbraco 3 that you need to modify to have the mentioned menu. Is that correctly understood?
What you need to figure out is where does the current navigation exist? Does this need to be modified or do you need to add a completely other menu structure.
It's a bit hard to give advice since I don't know how this solution has been setup. Usually I collect my javascript and CSS files in a folder called "frontend" where I then have subfolders.
But perhaps there already is an existing convention made by the former developer? Do you have access to a local development environment so you can do some trial and error to figure out how the solution has been structured?
I'm guessing that CSS files are placed in the "CSS" folder inside of Umbraco and that javascript is placed in the "Scripts" folder.
Since it's Umbraco 3 the navigation can be made up either using XSLT or Usercontrol. Inside the Umbraco backoffice you can go to the "Developer" section and expand the "Macroes" folder to see what macroes exist - Perhaps one or more has been titled something with "navigation". You can then click on the macro to see if it's based on XSLT or User controls.
Feel free to post the code from the navigation in here so we can give you further advice. If the site is live you could also show us a link to the site.
Hope this helps.
/Jan
thanks for reply
this is Umbraco 3.0.5...i need to modify that page to add on my drop down list menu...A former developer create the site since im new i need to add some maintenance to the site. i have access to all the page...the page is based on XSLT..the name of my page is "Product" under product i need to edit the Computing page my macros in Developer section looks like this image below
thanks in advance
is working on a reply...