Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #18024

    First of all thank you for this great theme! (propulsion)

    Love it,

    http://www.Svalner.se

    Here are a couple of things:

    1) I tried to place the search bar in the header but I want it to be fixed (I added a custom Css input with:

    }

    .search-form-header {

    position: absolute;

    top: 85px;

    right: 365px;

    }

    But it moves around with the “responsive” moves, I would like it to be fixed just below the flags in the header.

    2) I want Only the page that a visitor is in with the same colour as the logo: i.e. the underline that is under each page /hem/tjänster/ a.s.o.

    and the words (hem/tjänster/xxxx) to be red as well.

    3) remove the entire line above the header, (where the menu appears when I close the “welcome” text.

    4) can I have the same font in both the “blog” and the other “news” in the Home page (just below text and the slider) (the 2 widgets)

    #97940

    btw, the search bar is not working, I cannot search in it :(

    #97941

    Hi,

    To position the search box, please add this to quick css *after* the css you used which you can remove. Quick CSS is located in Propulsion > Theme Options > Styling at the bottom of the page.

    .search-form-header {
    position: static;
    float: right;
    margin-left: 10px;
    }

    or you can do it instead like this (just don’t use both)

    #searchform {
    position: relative;
    top: 60px;
    left: -150px;
    }

    That last one needs a media query for the iphone portrait size. We will return to it.

    2) Do you mean the menu item of the current page to be the same red color as logo?

    I think you took something out of the footer template that was needed because now the website shakes and jumps when i navigate.

    3) Do you mean you want the menu gone as well? or only the OK question, or menu to remain but no background top stripe?

    4) You are adding unstyled content to the home page. Please try not to use naked tags (<p> or <h2> or <div> instead just make up classes <p class=text342342″> because its possible to style that easily while its not so easy trying to grab a naked p tag.

    You are asking to have a common style between the two shown on the front page. Which of the two do you want to use?

    You can try to make the font size a bit smaller by adding that to quick css.

    p {
    font-size: .9em;
    }


    For making customization to your theme’s CSS, we recommend that you install and get to know Firebug ( http://getfirebug.com/css ) and Google Chrome developer tools ( https://developers.google.com/chrome-developer-tools/docs/overview ) browser add-on. Firebug is a free web development tool that integrates into Firefox and Chrome browsers and assists in monitoring, debugging and editing of any website’s CSS, HTML, DOM, and JavaScript files.

    Once installed, this easy to follow video will show you the basics of Firebug – http://vimeo.com/20917974 and get you on your way to customizing your theme like a real pro. It’s 5 minutes long, and by the end you will know how to style anything!

    Thanks,

    Nick

    #97942

    Hi

    thank you for the info Nick.

    I do have firebug, I can see the CSS; but have not changed anything in the custom.css yet since I don´t want it to “crash” .

    1) much better, now the searchbar is on the top RIght in the header. Used the .search-form-header {

    position: static;

    float: right;

    margin-left: 10px;

    }

    2) I want the words/letters of the MENu to turn red (as the logo ) when I enter that specific site, ie. if I am in “om oss” page it (the letters on the NAV menu) should be underlined and the colour should be change to the same red colour.

    3) the entire MENU on the grey background gone as well.

    4) I want to use the font that is currently on the right hand (kalendarium)

    and when I enter the <p class=text342342″> that u mentioned, where should I insert it?

    *where I insert the code directly or in a CSS? AND what should I put in the text25254? sorry I am pretty new to the styling.

    If I see something that I want to change in the CSS tha I see using firebug, should I just insert it in the quick css??

    #97943

    Hi,

    3) to make the very top disappear please add this

    #shop_header {
    display: none;
    }

    the code below will give some padding to your search form so its not touching the top and right corners (up to you)

    .search-form-header {
    padding: 10px 10px;
    }

    The code below fixes the Swedish flag half hidden

    #top #socket .social_bookmarks {
    top: -2px;
    }

    2) for styling the menu, please try the codes below, I used 3 colors and you can see what block changes what color ***You need to add all three blocks since some control the underline, others the menu item in various positions.

    #top .main_menu ul:first-child > li.current-menu-item > a, .main_menu ul:first-child > li.current_page_item > a
    {
    color: red;
    }

    div .main_menu ul:first-child > li.current-menu-item > a, div .main_menu ul:first-child > li.current_page_item > a
    {
    border-color: blue;
    }

    .main_menu ul:first-child > li.current-menu-item > a, .main_menu ul:first-child > li.current_page_item > a, #top #wrap_all .current_page_item > a
    {
    border-color: green;
    }

    4. Right now you home page has: Headers and the main text are Maco font, Main navigation is in Olbitron which doesn’t work for me and instead serif is shown, then there is Helvetica that is shown instead of Helvetica Neue, And the 2 columns of links above the footer , the left column is in Georgia and the right one is in Helvetica.

    You need to start using Firebug, and the custom.css file is empty so I am not sure what you are worried about breaking. Add the code to Quick CSS and see what happens, then take it out.

    [example]

    Watch a 20min video on using CSS from youtube , there are many of them, but spend a full day figuring it out, its easy with Google Developer Tools and once you understand it , you will laugh at how easy it is.

    <div class="a123"><p class="b23423">Hello world!"</p></div>

    the line above is html and you use the css to style it. The div you would use for positioning the paragraph for example, and the paragraph to style the font, color, rollover … so the css below

    .a123 {
    display: inline-block;
    position: relative:
    top: 40px;
    left: 10px;
    }

    the paragraph text is inside the div so you can references it directly if its used in one place .b23423 but you can also reference it by its parent tag (which is the div)

    .a123 .b23423 {

    font-size: .9em;
    color: blue:

    }

    Nick

    #97944

    thank u so much for the help.

    The header bar is gone, the search bar is padded, the current page menu have Red underline on it,

    the CSS and fonts I need to study more on.

    I will get back so more people can learn from this thread,

    I will “close” this as soon as I fix the problems, and post them here.

    Thank u so much for your help Nick,

    Great service.

    #97945

    You’re welcome! Enjoy the theme and if you got more issues, we are always here to help.

    Thanks,

    Nick

Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘A couple of more difficult changes for me’ is closed to new replies.