Mobile Responsive

This topic has 6 replies, 2 voices, and was last updated 11 years, 10 months ago by Wes.

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

Author

Posts
June 18, 2012 at 8:32 pm #1053
turnystudios
Customer
Hi there,

Loving the them by the way! Just having a few issues with mobile responsiveness.

Here’s the site i’m working on right now: http://nicole.turnystudios.com/

1 – My primary-menu elements are disappearing when I scale down to iPhone size.
2 – The thumbnails for the portfolio images (home page and otherwise) stretch a blur instead of just responding to the size of screen and shrinking.
3 – Is there a way to add written content above the portfolio page items? As you can see I duplicated the code for every type of photography but it would be great for both users and search engines if I could have the title of the page and ability to add text above the thumbnails.

Thanks so much!
June 18, 2012 at 8:44 pm #1054
Wes
Moderator
For the Primary menu issue, you have the height set at 42px, and when the site resizes it stays at 42px which is why it doesn’t show all of the menu links. So if you add a new height, ( or height: auto; ) on line 2409, it will make up for it when viewed at that browser size.

The thumbnails aren’t responding because the width on .home-feature-1 is 960px on line 643. When the browser is resized there should be a different width, either a percentage or “width: auto;” and it should work fine. You could try changing the width on 643 to auto, or you can create a new width that references .home-feature-1 in the responsive section of your css file.

I will be adding an update to this theme, as well as all of my other themes to look more like this – http://demo.appfinite.com/optimal/portfolio/ …..notice the Title and content. To do this, just add the following to the top of your page_portfolio.php file (right under – // Template Name: Portfolio) –
```
// Adds Page Title and Content
add_action('genesis_before_loop', 'genesis_do_post_title');
add_action('genesis_before_loop', 'genesis_do_post_content');

/** Remove Edit Link */
add_filter( 'edit_post_link', '__return_false' );
```
Let me know if that works
June 18, 2012 at 9:12 pm #1055
turnystudios
Customer
Thanks for the quick reply!

The menu fix worked great! Thanks 🙂

I set the thumbnails to auto and they are staying the appropriate size now. However, I’d like to align them and the portfolio page thumbnails to the center. Is this possible? I’ve tried all sorts of things.

The extra code in the functions.php file worked great too! Is there CSS to go along with it? I tested it out here: http://nicole.turnystudios.com/boudoir-photography/ but I’d like to add some padding to the bottom. Thoughts?

Thanks!
June 18, 2012 at 9:25 pm #1056
turnystudios
Customer
Sorry… one more thing. I’m not sure if this is something you can help with or if I just entered something in wrong but the title of the page jumps up a few pixels on every page except the home page.

normal: http://nicole.turnystudios.com/
high: http://nicole.turnystudios.com/about/
June 18, 2012 at 9:39 pm #1057
Wes
Moderator
Whoops, forgot the css part. You can add something like this –
```
#inner p {
    margin: 0 0 20px;
}
```
Add “padding: 0;” to line 184 in your css file to the #title ID. On your home page the h1 tag is used for the title, and on other pages the title is using a “p” tag…..which is why its showing differently.
June 19, 2012 at 4:22 pm #1059
turnystudios
Customer
Thank you so much!

Everything is looking great! Still working on fixing the title but I’m sure I’ll get it 🙂
June 19, 2012 at 4:30 pm #1060
Wes
Moderator
You’re Welcome

….in my previous comment I explain how to fix the title. Its just a padding issue.
Author

Posts

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

The topic ‘Mobile Responsive’ is closed to new replies.