Shell Lite Theme Modification

  • gsugapong

    (@gsugapong)


    11 years ago

    To whom it may concern,

    I am Gill Sugapong and I own this website http”//giswebsolutions.com. I used Shell lite theme because it has everything I need on a template. As you could take a glance on my website, you will recognize that there have been modifications. First, the widgets (from 3 col to 2). Second, I removed the headline and subheadline. So much for that, I just need some help for the following:

    1. How can I change the “searchbox” with a “tertiary widget” since I have removed the tertiary widget below the content area portion?
    Reason: I want to put a text on the supposed searchbox area where this text shows our toll free number.

    2. If ever no. 1 is possible, I would like to ask of How to move the Social icons? If I will be able to change the searchbox to text, I want to put the social icons below the text.

    3. I would like to change the 4 corners of the website into rounded one because it is so solid or pointed. What should I do?

    4. If you could time to visit the “about” page, you will notice that the footer is not on the right place.

    5. However, the footer on the rest of the page is placed correctly but the header together with the container were not aligned with the footer. I guess the footer (except on the “about” page”) is placed correctly. Both header and the container have margins of “0 auto;” as well as the footer.

    Thanks you very much indeed for reading. Any assistance or response on this post will be appreciated.

    Regards,
    Gill Sugapong

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter gsugapong

    (@gsugapong)

    11 years ago

    here the link again to my website giswebsolutions.com

    Stanko Metodiev

    (@metodiew)

    11 years ago

    Hi Gill,

    I’ll try to answer in your questions:
    1) If you want to put only text why don’t you HTML/PHP code in header.php file around line 68:

    <div id="search-box">
    //Your text here
</div><!-- end of #search-box -->

    2) If 1) is works for you, than try to edit CSS for social icons

    #header .social-icons {
    margin: 85px -85px 0 0;
}

    This is only for example, you have to adjust the numbers.

    3) About Rounded corners you can use border radius

    #header {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

#footer {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

    Same for the these numbers, you can play it them.

    About footer, make sure you have all </div> tags closed.

    Also keep in mind these changes will be gone when you updated theme, so make sure you have use Child Theme. Here is more information:
    http://codex.wordpress.org/Child_Themes

    Hope this will be helpful. Let me know if I can help you something else.

    Regards,
    Stanko

    Thread Starter gsugapong

    (@gsugapong)

    11 years ago

    Thank you very much indeed, I’ll try to work on it.

    Thread Starter gsugapong

    (@gsugapong)

    11 years ago

    I have done step 2 – 3, thanks for your immediate response!:) However, i got some proble using HTML/PHP. When I used your codes, the icons didn’t show.:(

    And before I forget, is it possible to put shadow outside the page? so that the page looks like floating? Thanks!

    Stanko Metodiev

    (@metodiew)

    11 years ago

    In header.php between two divs you should add your text.

    About shadow, probably its doable, but you have to play with CSS.
    This was never considered likely in order to maintain as clean as possible the theme.

    Stanko

    Thread Starter gsugapong

    (@gsugapong)

    11 years ago

    Yes, I had intered the text. after I updated, the text showed without the icons below. tsk!

    Stanko Metodiev

    (@metodiew)

    11 years ago

    The Social icons should be there, but they can be floating because of their margins.
    If you have something like this:

    <div id="search-box">
Sample text here.
</div>

    Your margins should be around:

    margin: 110px -100px 0 0;

    Of course these are example values. It depends of your text and icons.

    Thread Starter gsugapong

    (@gsugapong)

    11 years ago

    My nose is bleeding. AHAHAHA! I should call my web developer on this and finish this project. But, I’ll try to figure it by myself first. Thank you very much indeed!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Shell Lite Theme Modification’ is closed to new replies.