WordPress.org

Ready to get started?Download WordPress

Forums

Responsive
[resolved] Mobile view (20 posts)

  1. gavpedz
    Member
    Posted 1 year ago #

    OK so i have made many changes to the theme and featured home page my problem now is that the featured/homepage on a mobile does not look great how can i keep the current design but on mobile have it full width with featured text then image under that?

  2. gavpedz
    Member
    Posted 1 year ago #

    Sorry link is here http://gypsytboutique.co.uk/

  3. Andrew
    Forum Moderator
    Posted 1 year ago #

    Do some media queries;

    @media screen and (max-width: 480px) {
     #featuredimage,
     #featured {
      width: auto;
      padding: 0;
     }
    }
  4. gavpedz
    Member
    Posted 1 year ago #

    Fantastic thank you!

  5. Andrew
    Forum Moderator
    Posted 1 year ago #

    Gavpedz,
    You need to transfer your modifications into a Child Theme before the theme updates. Otherwise you will lose your changes if you update the theme and you don't want to be stuck on an old version of the theme.

  6. gavpedz
    Member
    Posted 1 year ago #

    Ah ok, i have not done this before any tutorials or anything on how i do this?

  7. Andrew
    Forum Moderator
    Posted 1 year ago #

    There are 8 basic steps to create a Child Theme
    http://codex.wordpress.org/Child_Themes#Example_of_a_basic_Child_Theme

    What changes have you been making, CSS only?

  8. gavpedz
    Member
    Posted 1 year ago #

    And some html in the home.php I am no expert so most likely been quite messy in my approach!

  9. Andrew
    Forum Moderator
    Posted 1 year ago #

    Copy your changed files into your Child Theme directory.
    Then copy the theme's original files and paste that in your normal theme's directory.

    Your Child Theme modified file will take precedence over the original file. It means you can now make changes to the Child Theme files and those changes will not affect the theme's original files.

    If you want to modify another file in future, take a copy of it and paste it into your Child Theme. Then you can modify it (within your Child Theme).

  10. Andrew
    Forum Moderator
    Posted 1 year ago #

    Your CSS modifications can just be copied into your Child Theme style.css file, because you're importing the rest of the styles anyway.

  11. gavpedz
    Member
    Posted 1 year ago #

    Thank you so all i need to do is create a new directory Responsive-child and put all current theme files in their then in the responsive theme put original files in their?

    So then in the responsive-child/style.css i add this?

    /*
    Theme Name: Responsive Child
    Description: Child theme for the responsive theme
    Author: Your name here
    Template: responsive
    */

    @import url("../responsive/style.css");

    Then all my edited css would be here?

  12. Andrew
    Forum Moderator
    Posted 1 year ago #

    All you need to do is create a new directory Responsive-child.
    Then follow the Child Theme guideline steps (you don't really have to complete all 8).
    Then for each modified file, copy that and paste it into your Responsive-child directory.
    Really that's all you need to do.

    So then in the responsive-child/style.css i add this?

    yes

    Then all my edited css would be here?

    yes

  13. gavpedz
    Member
    Posted 1 year ago #

    Ok thank you. I am having a little trouble finding the best way to get the featured image to stay in the right, i tried using padding but in some browsers/screen resolutions it did not work as well as i thought. I have now tried to float right the featuredimage which seems to work better but when i have tested this on http://quirktools.com/screenfly/ seems fine in most resolutions but on ipad and kindle hd8.9 the image is right but under the text box also i noticed in the phone screens i have a small amount of left to right scroll anyway to fix this? any tips welcomed.

  14. Andrew
    Forum Moderator
    Posted 1 year ago #

    @media screen and (max-width: 980px) {
     .grid {
      float: left;
     }
    }
  15. gavpedz
    Member
    Posted 1 year ago #

    Thanks ;)

  16. gavpedz
    Member
    Posted 1 year ago #

    Hi i am having trouble creating child theme.

    I edited the theme originally. Edited css and some files so i moved all files and folders to themes/responsive-child. Then i uploaded original responsive files to themes/responsive then in themes/responsive-child/style.css i added Template: responsive and changed Theme Name to Responsive-child now the site will not show anything and gives an error

    http://gypsytboutique.co.uk/

  17. gavpedz
    Member
    Posted 1 year ago #

    Ok so i managed to sort of get it back but bit it does not seem to be pulling my edits from style.css in the child theme and my homepage had now gone?

    I know i really need to sort having the child theme so i don't loose edits but i am struggling a bit here. Any help would be great.

  18. gavpedz
    Member
    Posted 1 year ago #

    I have had to put the theme back as it was before update for now but would really appreciate some help on this as i obviously want to keep it up to date but also keep my edits.

  19. Andrew
    Forum Moderator
    Posted 1 year ago #

    You might want to create a new thread regarding this Child Theme problem, so everyone can see it as. You also may need to activate the Child Theme to display the problem.

  20. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    If you put the functions.php file in the child theme, that WILL break your site. You should not just move all files to the child theme - only changes should go there (and not functions in any case - read the directions about child theme functions files) There's also a problem with the home page in the most recent Responsive update - see the CyberChimps support page for help with that.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.