Bulletpoints pages & sidebar

Discussion in 'Dzonia WordPress Theme' started by james_dg, Sep 16, 2013.

Thread Status:
Not open for further replies.
  1. james_dg

    james_dg New Member

    Joined:
    Sep 1, 2013
    Messages:
    15
    Likes Received:
    0
    Just a few more questions of some issues I encountered.
    .col3 .inner_area ul.first_column li.first{
    list-style-type: none;
    margin-left:0;
    background-image: url(http://www.infinitummobile.com/wp-content/uploads/2013/09/full-compatibility.png);
    padding-left:30px;
    background-repeat: no-repeat;
    background-position: 0 2px;
    }

    Thanks!
     
  2. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    Hello.

    1. For your first issue,
    Could you please explain your issue more clearly with the help of screenshot images.

    2. For your second issue,
    you need to create separate class or id (i.e. selector) for each <li> tag with in the <ul> tag having their separate class or id and style <ul> and <li> tag individually.

    For example:
    Put the code like given below in the text editor of your pages in your dashboard.

    <ul class="first_page">
    <li class="first">Enter the content of your first list </li>
    <li class="second">Enter the content of your second list</li>
    .
    .
    <li class="nth">Enter the content of your nth list </li>
    </ul>

    Now, style them individually by putting the code in the Custom CSS section of your dashbaord

    Code:
    .content ul.first_page li.first {
    margin-left: 0;
    list-style-type: none;
    background-image: url(Enter the URL address of your bullet images here);
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 0 2px;
    }
    .content ul.first_page li.second {
    margin-left: 0;
    list-style-type: none;
    background-image: url(Enter the URL address of your bullet images here);
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 0 2px;
    }
    .content ul.first_page li.nth {
    margin-left: 0;
    list-style-type: none;
    background-image: url(Enter the URL address of your bullet images here);
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 0 2px;
    }
    Similarly, do the same process for others.
     
  3. james_dg

    james_dg New Member

    Joined:
    Sep 1, 2013
    Messages:
    15
    Likes Received:
    0
    Hi Piyush,

    Thanks for your reply.

    1. Regaring the first issue, I have attached 2 screenshots. The first screensho shows the current layout with a very wide page, also caused by a sidebar in the same white colour making it look very wide. I would like to have a less wide page, or a separate block/sidebar of a different colour like in the 2nd screenshot.
    2. I have added the code as mentioned by you above, but nothing appears to happen. I've inserted the ul/li coding in the page itself, the CSS code within the CSS styling field and I've uploaded the images. Nothing has changed though.

    Cheers,

    James.
     

    Attached Files:

  4. james_dg

    james_dg New Member

    Joined:
    Sep 1, 2013
    Messages:
    15
    Likes Received:
    0
    Never mind the 2nd issue, it's working now. Think it must have been a cache problem.
     
  5. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    Hello,

    1. Unfortunately there isn't a way to do that with our theme unless you custom code something up. Sorry.
    If this isn't something you're able to do then you would need to hire a developer for this.

    2. The above given solution are worked for the feature page on your website.

    Likewise, with that trick you have to do for "Why mobile ?" page.

    But, now I have resolved this issue. You can check your website.
    Only you have to put URL of your bullet images in their respective URL code in custom css section.
     
  6. james_dg

    james_dg New Member

    Joined:
    Sep 1, 2013
    Messages:
    15
    Likes Received:
    0
  7. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    Yes, you have to use separate class or id for <ul> tag in different pages and then style <ul> and <li> tag individually.

    For the bullet image on feature page, go to the custom css and put URL of your bullet images in their respective URL code as shown in the image given below.

    [​IMG]


    This will solve your issue.
     
  8. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
  9. james_dg

    james_dg New Member

    Joined:
    Sep 1, 2013
    Messages:
    15
    Likes Received:
    0
    Thanks Piyush!
     
Thread Status:
Not open for further replies.

Share This Page