I'm using Jetpack social sharing icons. If I enable them on Front Page, Archives, etc. they work almost everywhere (Search Results, Posts, etc.).
However, they break on Post Excerpts such as when listed in a post-loop on the Blog page. Each icon shows a square where the icon should be.
Any idea what's causing this?
See behavior here: [redacted]
Click a post to see icons as they should be.
It looks like the CSS for the genericons is not being loaded on the /blog page, but it is being loaded for an article. It looks like this in the HTML:
<link rel="stylesheet" id="genericons-css" href="http://newman.tamucc.edu/wp-content/plugins/jetpack/_inc/genericons/genericons/genericons.css?ver=3.1" type="text/css" media="all">
It's a little bit of a hack because I'm not sure how exactly Jetpack is loading it's styles, but you should be able to get the icons to load on every page by adding this line to the top of your functions.php file:
wp_enqueue_style( 'genericons', get_template_directory_uri() . '../../plugins/jetpack/_inc/genericons/genericons/genericons.css', array(), '3.1' );
Related
I'm really new in coding, especially in css. I already read some tutorials but I like to change a specific thing. For my Website I use Wordpress. I also edited a few things in my CSS which already worked. Now I can't find a answer for how I can replace the title with a custom picture.
Click here to watch a picture to understand what I mean.
Click here to acess my website.
I already tried some things, but it would be nice if someone can explain me how to do it.
You can edit header.php in the twenty seventeen to display only a picture.
This source code is on your wordpress server in wp-content/themes/twenty-seventeen/header.php: https://github.com/WordPress/twentyseventeen/blob/master/header.php
You'll want to replace line 31:
<?php get_template_part( 'components/header/header', 'image' ); ?>
With something like
<img src="banner.png" />
You'll have to adjust the location of banner.png to where you actually upload the image.
After you've got that working and it's basically what you want, you can wrap the image tag in a a tag so the banner links back to your home page, if you'd like.
Recently I purchased a WordPress Theme called "Bonno" (http://bonno.aisconverse.com/). It's a great theme, but there seems to be one major drawback: Anytime you make a stylistic change to the style.css (via the Appearance --> Editor), the update will not occur.
I've tried:
Shift + R on a browser
Installing a plugin to clear the cache (WP Super Cache)
Making a post on a completely different page via Post/Update (this
sometimes works, other times does not -- not sure how or why)
Has anyone else encountered similar issues on Bonno? Or any other WordPress themes?
To solve this problem your can add extra string right after the filename using a ? character.Edit the theme file to change the link tag.
Example-
<link rel="stylesheet" type="text/css" href="style.css?123">
However it gets static and next time if you change the CSS again you might not get the update instantly. For this, you can use PHP to add the string dynamically by using time() function.
<link rel="stylesheet" type="text/css" href="style.css?<?php echo time(); ?>">
And now you can get instant update of your changes. This will not affect your CSS file.
On Wordpress.org, I activated a BLANK theme by Chris Coyier.
I edit index.php and my changes are showing up on my website. Fantastic.
I edit the existing style.css file but none of my edits are showing up. Ugh.
I delete style.css and the website still works. Why?
I repeat these steps with a different blank theme. Same issues.
Questions
Why am I unable to edit style.css of ANY blank theme? I am confused because I am able to edit style.css of Twentyfourteen theme.
If I delete style.css from the blank theme, the website still works and still shows the same CSS styling. How is this possible?
For blank themes, the stylesheet is called in header.php as
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
But for Twentyfourteen theme, I don't see any call for a stylesheet.
Why do regular themes not have a call for a stylesheet in header.php? Is this why I cannot edit style.css of blank themes?
Most likely your browser is caching the CSS?
What happens when you use your browsers dev tools to check the CSS source.does that show your edits?
When you say "delete the CSS" do you get a missing resource error on the browser console?
If it does not, try force reloading your page.
I am trying to build a second .css file for my company's website.
Currently, we are using a responsive theme, so most of our content displays correctly on desktop and mobile browsers. However, recently the boss is requesting custom code that is unresponsive. In order to keep the site looking good, I want to apply a secondary stylesheet that contains formatting for mobile devices. It would be like this for any html page:
<link rel="stylesheet" href="http://domain.tld/mobile.css" type="text/css" media="handheld" />
I cannot figure out how to get this into a wordpress child theme correctly. Can anyone offer suggestions?
Thank you in advance.
Look for the header.php file in your child theme directory, or under "Appearance"->"Editor" in the main menu of the your Wordpress adminpanel. You can paste the link to your new stylesheet there.
Also consider moving the styles to your theme's directory and replacing the domain in your href with <?php echo get_stylesheet_directory_uri(); ?> (example from wordpress codex).
I've semi-successfully created a wordpress child-theme. By successfully I mean:
I managed to create a child-theme directory in my themes folder, next
to my main theme
I created a style.css file in the child-theme dir
I saw the style show up on my Wordpress back-end and managed to activate it
I added templates (header.php, sidebar.php,...) to the directory
I made changes to the above templates and saw the changes on my site
However, there is one huge problem:
Whatever CSS I try to add to the style.css file, it's not affecting the site
I know the "information header" must be ok since I was able to see/activate the child-theme. But I really can't figure out what is wrong. I tried removing the #import rule, which according to the Wordpress codex should remove all styles from my site - nothing happened.
I'm using the Panorama theme and created "panorama-technology" as a child. Below you can see the code I have in the style.css file inside the child-theme: "panorama-technology":
/*
Theme Name: panorama-technology
Template: panorama
*/
#import url("../panorama/style.css");
#search{
margin: 15px 15px 0 0;
}
WouterB, I had the same problem with my child theme loading in the backend, and child php pages overriding the parent theme php pages, but NO child CSS changes loading to override the parent styles.
So,although with different coding, it turns out my parent theme was written in such a way that the header was also looking for the stylesheet in the template directory, so your solution was spot on in concept.
Thus, by changing the call in the header from :
<link rel="stylesheet" type="text/css"
href="<?php echo get_template_directory_uri();?>/style.css" />
to:
<link rel="stylesheet" type="text/css"
href="<?php echo get_stylesheet_directory_uri();?>/style.css" />
--did the trick like magic. At least as far as I can tell so far.
You get major credit in my book!
First I'd try an absolute path to be sure that the path isn't the problem. If that does not solve the issue. Place the #import at the very top of the css file or directly after thelast "*/". I think white space is probably the culprit here.
Do not use import.
Add time after css uri for refreshing everytime.
In your function.php
function child_style() {
wp_enqueue_style( 'parent-child', get_stylesheet_uri().'?'.time());
}
add_action( 'wp_enqueue_scripts', 'child_style', 20 );
Watch out from caching :
wp cache plug-ins
server side cache (APC etc.)
local browser cache