Viewing 20 posts - 1 through 20 (of 25 total)
1 2
  • Author
    Posts
  • November 4, 2016 at 7:05 am #102818
    RodeBoy
    Participant

    I am re-styling my sons website at http://www.mattfurness.co.uk.

    Three queries please;
    1) I have used images sizes 1920 x 1080 as featured images on pages, to be used on the home page slider. However the images appear to be too big as they do not automatically include the social media icns at the bottom. Am I better using a different size? If so please advise the best size.
    2) As you can see the white font on the home page does not work with all the images. Can you advise CSS coding to change the colour of site title and description, and also title and wording in the slider please? I can then play around to find the most suitable hex code to use.
    3) Also CSS code please to change links from an underline to a diffrent colour for the text.

    Many thanks. I appreciate the work gone into this theme.

    Chris

    November 4, 2016 at 10:35 am #102831
    Mahesh
    Participant

    @rodeboy: I just checked your theme:
    1. The recommended image for slider is 1920 x 1080 and its seems to be working fine. I guess you’ve managed to display the social icons on the slider too.
    2. Changing text color, go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

    /* Site title and description color */
#site-details .site-title a, 
#site-details .site-description {
    color: #00ffff;
}
/* Main slider title and text color */
.main-slider .entry-title, 
.main-slider .entry-title a, 
.main-slider .entry-summary {
    color: #00ffff;
}

    3. Change links from an underline to a different color for the text

    a {
    color: #00ffff;
}

    Note: Please use your desired color.

    Regards,
    Mahesh

    November 5, 2016 at 5:43 am #102863
    RodeBoy
    Participant

    Thanks Mahesh for your very quick reply. Very helpful and all works well, but I am still getting the underline on content links. I guess that there should be a text-decoration: none; code in there somewhere. Could you please advise?

    I am still playing around with colours for the home page slider, and any suggestions are welcome!

    Thanks again, Chris

    November 5, 2016 at 6:19 am #102864
    RodeBoy
    Participant

    Regarding the wording in the slider, maybe it would be best to use a background box like here http://www.benkennedydrums.com/. Is that something you can do in Rock Star? Also is there a way to have a different message in the box on each slider (where I have ‘Find Out More …’)

    November 5, 2016 at 7:08 am #102865
    RodeBoy
    Participant

    I have managed to remove the underline from this article https://catchthemes.com/support-forum/topic/links-a-hover-and-removing-underline-text-decoration/

    Any ideas on displaying the text on the home page slider?

    November 6, 2016 at 12:31 pm #102904
    Mahesh
    Participant

    @rodeboy: Glad to know you’ve managed to resolve your issues. No you can’t have different message in the box on each slider.
    Can you please clarify more on displaying the text on the home page slider.

    Regards,
    Mahesh

    November 7, 2016 at 3:09 am #102922
    RodeBoy
    Participant

    Thanks again Mahesh.

    The issue I have is that with different images in the slider the text on the home page slider reads perfectly well against some, but not so well for other images (have a look at my site to see what I mean) I am trying to find a colour that works best on all backgrounds. One thought is to put the wording in a box, as per the site I mentioned. Is that a possibility in Rock Star? If not, do you have other suggestions?

    I very much appreciate your help and time taken to help me here.

    Chris

    November 7, 2016 at 2:41 pm #102929
    Mahesh
    Participant

    @rodeboy: Do you mean to to have boxed, with color background and border. Please add the following:

    .main-slider .slider-contents {
    border: 1px solid #fff;
    border-radius: 5px;
    background-color: #00ff00;
}

    Let me know if any problem.

    Regards,
    Mahesh

    November 7, 2016 at 3:37 pm #102934
    RodeBoy
    Participant

    Works a treat – thank you Mahesh. I have given it the same background and opacity as the menu. I now need to decide if the box is too big for the page!

    Regards, Chris

    November 7, 2016 at 4:24 pm #102937
    Mahesh
    Participant

    @rodeboy: Hmm looks nice with the opacity. 🙂
    The box seems fine but let me know if I can help you further.

    Regards,
    Mahesh

    November 8, 2016 at 6:20 am #102961
    RodeBoy
    Participant

    Thanks for your comments Mahesh. I’ll certainly ask if I need further help!

    Chris

    November 8, 2016 at 10:44 am #102969
    Mahesh
    Participant

    @rodeboy: Thank you for your appreciation. Have a nice day!

    Regards,
    Mahesh

    December 2, 2016 at 6:34 pm #104388
    RodeBoy
    Participant

    A further question Mahesh please. It appears that auto-hyphenation is set up within the theme and on some pages there are simply too many words which are being hyphenated. Is there a CSS code I can use to remove this please?

    Thanks Chris

    December 4, 2016 at 9:22 am #104487
    Mahesh
    Participant

    @rodeboy: Add the following CSS:

    .hentry {
    hyphens: none;
}

    Regards,
    Mahesh

    December 4, 2016 at 6:45 pm #104511
    RodeBoy
    Participant

    Lovely job Mahesh – thanks.

    It is still showing some hyphens on the mobile version though. Is that likely to be a cache issue? I have cleared it within WP Admin.

    Chris

    December 5, 2016 at 9:47 am #104545
    Mahesh
    Participant

    @rodeboy: Yes, may be a caching problem. I checked your site on both desktop and mobile and no hyphens are showing.

    Regards,
    Mahesh

    February 11, 2017 at 6:07 am #109387
    RodeBoy
    Participant

    Hi Mahesh, I have one more question in connection with the same site http://www.mattfurness.co.uk

    On my iphone when viewing the site in portrait mode as the slider is small it is virtually covered by the header/menu. This is not a problem in desktop view, on my laptop, as the slider image is large enough to carry this. Is there a way around that? Maybe by not overlaying the header/menu over the slider … but just on the mobile view? Is there a CSS coding I could use?

    I look forward to hearing from you with interest.

    Thank you for your time,

    Chris

    February 11, 2017 at 9:18 am #109400
    Mahesh
    Participant

    @rodeboy: Add the following CSS:

    @media screen and (max-width:500px) {
    #masthead {
    	position: unset;
    }
}

    Regards,
    Mahesh

    February 11, 2017 at 4:51 pm #109415
    RodeBoy
    Participant

    Thanks Mahesh – prompt and helpful as always.

    This does the job, but then when I scroll down I lose the header and menu. Is there a way to keep it displaying whilst the rest of the content disappears behind it?

    Many thanks, Chris

    February 12, 2017 at 10:00 pm #109495
    RodeBoy
    Participant

    In addition Mahesh I have just noticed that on the non-home pages (on iphone portrait) there is a large black space at the top. This would appear to be as a result of this code. Would it be better to adjust the position of the home page slider, rather than the header which appears on all pages?

    I have left this code in there at the moment so you can see what I mean.

    Cheers, Chris

  • Author
    Posts
Viewing 20 posts - 1 through 20 (of 25 total)
1 2
  • The topic ‘Slider Image Size & font colours’ is closed to new replies.