My blog posts appear in the footer section of my website. I've looked at my code, and I can't figure out where the problem is stemming from. I've included a link to a dropbox file that includes all of my current theme folders, as well as a screenshot of what my site currently looks like. If anyone has any solutions I would appreciate it!
dropbox.com/sh/jvafvxqylg8wuye/AACSatmJfpbLa02-bsbn0yH6a?dl=0
Judging by the template files and without seeing the outputted HTML, this could be caused by mismatching element declarations. In the header.php the <header> element is declared but never closed. Try closing the header element with </header> in the end of the header.php
It could be a styling issue - have you tried adding clear: both; to .site-footer {} in your CSS?
EDIT:
I'd suggest that you wrap your content in a container that has clear: both; assigned to it - this will prevent your articles from clashing with anything else on the page.
Related
On my wordpress website, I am using NewsCard theme referring this youtube tutorial.
I have added categories to Menu but I am running into a strange problem.
As visible in the below image, I am getting huge gutters between the news cards which is ugly and resulting into the cards layout as very long vertical post cards.
Can someone help me resolving this? I am not able to figure out what I am doing wrong here. I was using generatepress theme earlier.
The more natural layout should be:
Thanks in advance.
In the file https://examtipsindia.com/wp-content/plugins/gp-premium/blog/functions/css/style.min.css?ver=1.12.2 this rule is adding the issue
.generate-columns.grid-50, .grid-sizer.grid-50 {
width: 50%;
}
I can't see without accessing your admin the best way to add a custom CSS rule to fix the one above, but as I don't see a child theme or plugin, go to Appearance > Cutomize > Additional CSS, add the CSS below and "Publish" to save the changes:
body.archive.category #main .generate-columns.grid-50{
width:auto;
}
That should do it, but if it doesn't let me know.
I've been trying to debug a web site to speed it up. I search a plugin in wordpress and I found Autoptimizer and decided to use it. After minifying CSS files and inline CSS files, some bug appeared in the blog. I saw that web pages act like they are on mobile-view mode except index.php so home page. I do not know how to solve it and I could not fix it.
This is the homepage of wordpress website. As you see footer is good positioned. But when you check the other pages such as this one, it is aligned like I open the web page in a mobile device. Not only footer but all body parts, elements, classes act like they are in a mobile device.
I deactivated the CSS options of AutoOptimizer but afterwards some HTML elements got broken. That's why I re-activated the plugin and thought this problem (instead of some broken tags) can be solvable than other one.
Please help me. I think sharing CSS codes is unnecessary because you can display them easily with dev options in browser. Even I compared their container classes. I try to find differences between container div in index.php and container div in other pages but they are the same classes and have same attributes.
You're missing float, margin-right, and position on the other pages footer in element with class one-fourth from what I can tell. Seems like you forgot to load a stylesheet to me.
Edit:
Did some further review and it seems like you're missing the following styling for the class one-fourth in your footer:
position: relative;
float: left;
margin-right: 4%;
width: 22%;
in my wordpress blog using theme "hueman" I added a logo.
I looked with firebug in the code and saw that the logo is set as h1 tag on every page. I would like to remove this because I want the titles in the text/content to be h1.
Unfortunately I can't find the code and don't know what exaclty needs to be removed?
Using firebug it says "h1....site-title..." but in the css file I only find a page-title that is defined with h1. Do I just have to delete the "h1" here?
Thanks for helping me
BR
Heidi
I have never used the hueman theme... however if you look in the folder wp_content/themes/hueman/header.php
In word press themes the logo and top menu are normally rendered in this file and is called by the wp_header() function with in your templates.
I have a PHPBB forum and my avatars aren't being displayed. When I inspect the element the img element is greyed out.
I can't work out what the problem is, I have tried to edit the css to display: block but this doesn't resolve anything. In the settings avatars are also enabled so that isn't the problem.
As you can see the image when you hover over the source, I'm confident that you don't have a image directory error.
Have you edited many css files?
Have you put some display: none; lines in any of them?
If yes, go over each line (use search function in your IDE) and comment them out, see if it resolves your issue.
Report back with your result.
Stewartside helped me use JQuery to create a specific function for my main navigation on my website (thanks again!). I created a child theme to add the changes to my header.php file and it has started to cause a weird layout change. My homepage should have 20px padding, which is NOT a special CSS modification, but the child theme automatically removes it. This doesn't happen with other pages on my site, just the homepage. I have also added/removed the jquery code to make sure that wasn't the problem; the style.css file for the child theme only has the "child theme" coding, no modified CSS.
Homepage: http://bostonirishclothing.com
About Us: http://bostonirishclothing.com/about-us
Is there anything that would cause this?
Get the Firebug add on for your browser (available on Chrome and Firefox). Then right click the section that is causing the issue and you can see the coding and all the relevant CSS functions including the files they are in (to the chosen section). It will also show which CSS function is being prioritised compared to the other. Then you can modify the functions or add new ones to make it work.
A dirty way to do things is to use !important however this should only be used sparingly as it can screw with other pages. An easy way to avoid that is to make the CSS function for example .entry-content { color:#fff; } becomes .post-x .entry-content { color:fff!important; }
Test things out. Firebug is amazing help when editing CSS. You can even do some of the tests in firebug itself.