Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

  • Uros Sankovic 107 posts 134 karma points
    Apr 07, 2010 @ 10:38
    Uros Sankovic

    How can I do this with umbraco?

    Hi, guys,

    I have a HTML version of a page,now I want to do it with Umbraco. Here's the HTML code:

    <!-- WE -->


    <div id="we" class="anchor-zone"></div>

    <div id="we_content" class="box_content we">

    <h1 class="us-col shadow"><span style="letter-spacing:-0.05em">b</span>ibi <span style="letter-spacing:-0.09em">


    <ul class="content-list"> 

    <li><span class="us-col">...</span> je <a class="curtainIt screenshot" id="we_thumb.jpg" href="#bibiprojekt">

    zanesljiv partner</a>.</li> 

    <li><span class="us-col">...</span> zaposljuje <a class="curtainIt screenshot" id="certified_thumb.jpg" href="#certifikati">

    certificiran kader</a>.</li> 



    <!-- ACTIVITY -->


    <div id="activity" class="anchor-zone"></div>

    <div id="activity_content" class="box_content activity">

    <h1 class="activity-col shadow"><span style="letter-spacing:-0.05em">


    <ul class="content-list"> 

    <li><span class="activity-col">... </span><a class="curtainIt screenshot" id="activity_thumb1.jpg" href="#vodenje">

    projektno vodenje</a>.</li> 

    <li><span class="activity-col">... </span><a class="curtainIt screenshot" id="activity_thumb2.jpg" href="#svetovanje">


    <li><span class="activity-col">... </span><a class="curtainIt screenshot" id="activity_thumb3.jpg" href="#marketing">




    <!-- BLOG -->


    <div id="blog" class="anchor-zone"></div>

    <div id="blog_content" class="box_content blog">

    <h1 class="blog-col shadow"><span style="letter-spacing:-0.05em">B</span>log</h1> 

    <ul class="content-list"> 

    <li><span class="blog-col"></span><a class="curtainIt screenshot" id="blog_thumb.jpg" href="#blog"> 

    Zakaj so nekateri projekti uspešni,drugi pa ne?</a></li> 


    <div id="tumblr">starejše lanke si lahko preberete na <a href="" class="ext_notip"><img src="image_src/logo_blog.jpg" alt="blog" />log</a>.</div> 


    <!-- LINK -->


    <div id="link" class="anchor-zone"></div>

    <div id="link_content" class="box_content link">

    <h1 class="link-col shadow"><span style="letter-spacing:-0.05em">O</span>bišite</h1> 

    <ul class="content-list"> 

    <li><span class="link-col">...</span> podjetje <a class="ext" id="360ecm_thumb.jpg" href="">


    <li><span class="link-col">...</span> organizacija <a class="ext" id="aiim_thumb.jpg" href="">


    <li><span class="link-col">...</span> organizacija <a class="ext" id="cms_thumb.jpg" href="">


    <li><span class="link-col">...</span> organizacija <a class="ext" id="bcs_thumb.jpg" href="">





    <!-- CONTACT -->


    <div id="contact" class="anchor-zone"></div>

    <div id="contact_content" class="box_content contact">

    <h1 class="contact-col shadow"><span style="letter-spacing:-0.05em">




    <div class="hello_td hello_td1"> 

    <div class="hello_place"><em>bibi Projekt</em></div> 

    <div class="hello_email greenIt"><a href="">


    <div class="hello_phone">+386 40 20 60 80</div> 

    <div class="hello_addr">Drnovškova pot 14<br />1241 Kamnik<br />







    When the user clicks the link, new DIV opens and in it the HTM loads (JavaScript).

    If you take a look at "WE" part, there I have a <ul class="content-list"> in inside is <li> tag. How can I make that <li> list in each div in Umbraco? If you take a closer look, you'll see there's a <a> tag with many atributes. How can I add those in Umbraco dynamically?


    I'm just starting with Umbraco, so any help would be much appreciated! If you have any questions,please ask!


  • Dirk De Grave 4534 posts 5981 karma points MVP 3x admin c-trib
    Apr 07, 2010 @ 11:37
    Dirk De Grave


    I suggest you look into Warren's CWS2 package, which can be found on the project section, and start playing with it so you get familiar with the building blocks (doc types, templates, macro's, etc...). Installation can be done through the developer section (Packages node)

    Alternatively, have a look at for some instructional vids on setting up things quickly (there's free vids available from the homepage)




  • Uros Sankovic 107 posts 134 karma points
    Apr 08, 2010 @ 09:30
    Uros Sankovic

    Dear Dirk,

    i didi check the CWS2 in there's nothink like i need. I posted my question because the documentation on Umbraco is poor and I just need a little direction,not the solution (if I need to check another datatype etc.).

    THX anyway.

  • Seth Niemuth 275 posts 397 karma points
    Apr 08, 2010 @ 10:05
    Seth Niemuth

    I would check out the documentation that there is:

    To do something dynamic based on what page you are on the easiest method is to use XSLT:

    You will be putting most of the HTML into your templates and any dynamic HTML into your XSLT.

    Your questions:

    'How can I add those in Umbraco dynamically?'...Dynamically, by what? If it is by page, you will want to use XSLT i would think.

    'How can I make that <li> list in each div in Umbraco?'

    The easiest way would be to copy and paste your <li> into each div





  • Dany Wu 81 posts 114 karma points
    Apr 08, 2010 @ 12:49
    Dany Wu

    Uros, I don't think Dirk meant there's a "recipe" that'd suit your exact requirements within the CWS2 package. I'm not entirely sure what you were expecting when you said "i didi check the CWS2 in there's nothink like i need". The package itself illustrates the basic concepts and building blocks within Umbraco itself. It's up to you to understand these concepts and apply them to your requirements. I seriously doubt Umbraco's online documentation or wiki will grow to have every recipe for every possible situation.


    Basically what you need to do is chop up that chunk of HTML in your original post. The "static" parts go into your templates, the "dynamic" parts go into Umbraco macros. These macros can be XSLT or .NET usercontrols, it's up to you. There may be some exceptions to this suggestions but for the most part that's the general idea.

Please Sign in or register to post replies

Write your reply to: