Forum Replies Created
-
Posts
-
Found one mistake.
When you are on a small screen size and you click to show up the sub menu items, the background is a very light color, making the text very difficult to read. You may want to change this to the same blue you have been using, or slighter darker if you want to the hierarchy of the menu to be visible.
I love helping creative entrepreneurs build epic things with WP & Genesis.
As always, I like to pick out the nitty gritty, but a few things that immediately stand out..
The logo isn't retina friendly, it looks really blurred on my screen, so it would also be blurred on the iphone etc etc.. easily solved by just uploading an image twice the size.
The images at the bottom of the home page aren't the right size and don't cover the whole width, so there is a white gap to the right of them - at every screen size. This may have been that you haven't selected the correct image size in the settings in the plugin.
The last thing is that as you are using h4 heading in your post. The titles don't stand out at all, and are nearly the same size as your body text. Maybe this one is more personal taste, but i'd say you need at least a 30px on the headings inside a post if you're using an 18px body text.
I love helping creative entrepreneurs build epic things with WP & Genesis.
Long answer, sorry I started to write and write telling you exactly what I would do.. haha
Design wise, there are only a few things i would say that need neatening up. .
The extra padding on the header menu is causing the menu items to not exactly align with the site title so I would remove that.
On small mobile widths, the responsive menu icon doesn’t have enough padding making it look cluttered so I would add some more padding there.
The last thing is that when you visit individual pages of the site, for a split second as its loading you see a big jolt in the page where the layout has to quickly align itself and the page titles move.
You can see it here..
http://corrector.nl/waarom-corrector/ (if you dont see it, try clearing your browser cache and you'll see it the way a new visitor to the site would see it)
For a second, the text ‘Houd je handen vrij’ is too close to the top of the screen then it drops back down a second later. This is because the javascript used to create the shrinking header effect is still being loaded even though you are no longer using that effect. There is a div created by the javascript called .bumper which is causing the problem as it being created as the page loads.
I can see you have amended the javascript yourself to stop the effect, but unfortunately this only solves half the problem and causes the unsightly jolt.
My honest opinion would be to install parallax pro instead. It has the parallax effect that you use on the front page already built in and if you follow this tutorial exactly...
You can make it exactly the same layout to what you have now. i nearly wrote a whole tutorial on how you would change what you have now to stop the jolt, but it became too big I realised it was the wrong solution, sorry,
I love helping creative entrepreneurs build epic things with WP & Genesis.
If you mean that you are trying to make the height at 400px between widths 970px and 873px, but it is remaining at height 300px. it is because you have set the height to be 300px later on in your stylesheet so the bit about 400px is being overridden.
Try changing the order of the css to make sure the 400px overrides the 300px for them particular screen sizes.
I love helping creative entrepreneurs build epic things with WP & Genesis.
It is showing, but the menu icon is white and you have changed your header to be the same color.
To change the menu icon color, add this to the bottom of your style sheet
.responsive-menu-icon:before { color: #333; }Just change the value to suit whatever color you need.
ps i'd be a bit cautious with using such a light shade of grey against white. On older computers, people may not be able to see the menu at all.
I love helping creative entrepreneurs build epic things with WP & Genesis.
oh and if you're on mac...
I apologise that its not a direct answer to your question. I don't use that particular child theme so I cannot tell you my experience, but for sure, setting up a local install where you can test updates will ensure you'll never need to ask the question again.
I love helping creative entrepreneurs build epic things with WP & Genesis.
Have you considered always keeping a copy of your site local? As in, on your computer? This is an easy way to update Genesis, WordPress and plugins without the worry of the live site crashing.
It honestly only takes about 10 minutes to do and there are videos to help you..
Make a copy of your child theme, put it onto your local install and import all your content. Then when an update comes, just do it on your local site first. If everything is ok then do it on your live site.
The other option of course is managed hosting, which often means you get a 'staging area' site to test updates.
I love helping creative entrepreneurs build epic things with WP & Genesis.
Do you mean you want to get rid of the responsive menus, so you can see the menu items without having to click the three grey lines (burger menu) to see them?
If so..
You just need to remove the javascript which creates the mobile menu on smaller screen widths. You do this by REMOVING this line from your functions.php file..
wp_enqueue_script( 'lifestyle-responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );Just make sure you edit in your ftp as if you delete something wrong it will crash your site and you need to be able to press 'undo'
I love helping creative entrepreneurs build epic things with WP & Genesis.
To change with width of the sidebar find this in your stylesheet
.sidebar { width: 400px; }and change the pixel value to whatever you need it to be.
To change the sidebar widget sizes, I'm guessing you wanted a bit of space so the text isn't touching the border, then you just need to add some padding to the wrap. so for example, add..
.sidebar .widget-wrap { padding: 20px; }or something similar.
I love helping creative entrepreneurs build epic things with WP & Genesis.
This is what you have...
.entry {
margin-bottom: 60px;
}If you don't want any space at all, change it to...
.entry {
margin-bottom: 0;
}I'd be careful though, white space is usually a good thing for stopping a website looking too cluttered.
I love helping creative entrepreneurs build epic things with WP & Genesis.
You just need to write it like this.
// Home feature widget section add_action( 'genesis_after_header', 'home_do_featured' ); function home_do_featured() { if ( is_active_sidebar( 'home-featured-full' )) { genesis_widget_area( 'home-featured-full', array( 'before' => '<main class="home-featured-full">', 'after' => '</main>', ) ); } }But the genesis_after_header is the correct hook. You can see here that it is full width http://genesistutorials.com/visual-hook-guide/
I love helping creative entrepreneurs build epic things with WP & Genesis.
I looked again and you have an image as the background for your header...
Find this in your css...
.site-header {
background: url(http://www.worblos.com/wp-content/themes/eleven40-pro/images/texture.png);
}and change it to what I said before.
I love helping creative entrepreneurs build epic things with WP & Genesis.
the only way to make it appear on homepage thumbnail as well as in single post is to set featured images and insert into the post.
You can have the featured images appear in the single posts without having to insert them everytime - http://wpsites.net/web-design/display-featured-image-before-or-after-entry-title-on-single-posts-pages/
For the images not appearing on your home page, have you tried https://wordpress.org/plugins/regenerate-thumbnails? The images which you already have in your media library may not be suitable size.
I love helping creative entrepreneurs build epic things with WP & Genesis.
The media queries are pretty simple. You need:
/* # Media Queries
---------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1200px) {//code in here
}
@media only screen and (max-width: 1024px) {//code in here
}
@media only screen and (max-width: 960px) {//code in here
}
@media only screen and (max-width: 800px) {//code in here
}
The best way is to start reducing the width of your browser until something looks wrong. Then make that a break point and write the new css to fix the problem. On your website i can see things go wrong as you get smaller than 1024px. So to start you off.. to fix your menu and widget area problem...
@media only screen and (max-width: 1024px) {.nav-primary {
width: auto;
}.site-header .widget-area {
text-align: center;
}}
I love helping creative entrepreneurs build epic things with WP & Genesis.
add this the bottom of your style.css file
.site-header {
background: darkred;
}change darkred to any color or use hex values, so #444 for example.
I love helping creative entrepreneurs build epic things with WP & Genesis.
I changed it a bit, but you can see it working on my blog.. example post
I love helping creative entrepreneurs build epic things with WP & Genesis.
http://www.carriedils.com/add-author-avatar-post-info/
I love helping creative entrepreneurs build epic things with WP & Genesis.
We would need a URL to have a look what is wrong.
I love helping creative entrepreneurs build epic things with WP & Genesis.
remember to keep both }); at the end or it wont work 🙂
I love helping creative entrepreneurs build epic things with WP & Genesis.
go into your themes folder. Go inside the folder "js". Then open up home.js.
You basically want to delete the middle bit, as this is what is creating the fade.
It should look like this.. then hit save.
jQuery(function( $ ){
$.localScroll({
duration: 900
});});
I love helping creative entrepreneurs build epic things with WP & Genesis.
