Font Change – CSS

greytocolour · Member · Apr 13, 2016 at 9:21 am
Copy link

Add topic to favorites
I think my theme developers changed more than I thought. My font looks thicker than it did before and I’m not really a fan of it. Any CSS tips for making it thinner please? I basically want the original version back.

The blog I need help with is: (visible only to logged in users)
princesse10011 · Member · Apr 13, 2016 at 2:33 pm
Copy link
You have to change the font-weight in the CSS Stylesheet. Which fonts (title, undertitle or text) do you want to make thinner?
greytocolour · Member · Apr 13, 2016 at 2:35 pm
Copy link
Thanks for contributing. I would like to make the main text thinner, not the titles/headings.
princesse10011 · Member · Apr 13, 2016 at 3:09 pm
Copy link
You have to put the following code as first line in the <head> area of your Index File:

<link href=’https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,200,200italic,300,300italic,600′ rel=’stylesheet’ type=’text/css’>

You can find the file under Appearance -> Editor.
princesse10011 · Member · Apr 13, 2016 at 3:12 pm
Copy link
It is possible that the file is called header.php oder index.php.

You have to put it in the file which has this <head></head> Area
greytocolour · Member · Apr 13, 2016 at 3:15 pm
Copy link
I have no ‘Editor’ option. Is this because I am not self hosted?
princesse10011 · Member · Apr 14, 2016 at 5:30 am
Copy link
Yes, that’s possible. You could try to download the following plugin: Simple Custom CSS and insert in your custom CSS this code:

/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight’), local(‘SourceSansPro-ExtraLight’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGAIasgMoEcVHo3r268QTaWo.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight’), local(‘SourceSansPro-ExtraLight’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGJCDkYQxybH_Rl7Qv7ee2N4.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight’), local(‘SourceSansPro-ExtraLight’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGCVh0V6fR69OLaFLklYbiSk.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 300;
src: local(‘Source Sans Pro Light’), local(‘SourceSansPro-Light’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGD_j0nMiB9fPhg_k1wdK2h0.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 300;
src: local(‘Source Sans Pro Light’), local(‘SourceSansPro-Light’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGDRVvBvQIc1z78c__uoBcyI.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 300;
src: local(‘Source Sans Pro Light’), local(‘SourceSansPro-Light’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGOode0-EuMkY–TSyExeINg.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 400;
src: local(‘Source Sans Pro’), local(‘SourceSansPro-Regular’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/ODelI1aHBYDBqgeIAH2zlNOAHFN6BivSraYkjhveRHY.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 400;
src: local(‘Source Sans Pro’), local(‘SourceSansPro-Regular’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/ODelI1aHBYDBqgeIAH2zlC2Q8seG17bfDXYR_jUsrzg.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 400;
src: local(‘Source Sans Pro’), local(‘SourceSansPro-Regular’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/ODelI1aHBYDBqgeIAH2zlNV_2ngZ8dMf8fLgjYEouxg.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 600;
src: local(‘Source Sans Pro Semibold’), local(‘SourceSansPro-Semibold’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGClYwVOhDRq2vbpGRTZ7bbs.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 600;
src: local(‘Source Sans Pro Semibold’), local(‘SourceSansPro-Semibold’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGFKFh1TDTPrUZWzVp6FtpG8.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: normal;
font-weight: 600;
src: local(‘Source Sans Pro Semibold’), local(‘SourceSansPro-Semibold’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGCOFnW3Jk0f09zW_Yln67Ac.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight Italic’), local(‘SourceSansPro-ExtraLightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6Dx8cL9zsYYyxVMwatU85cQ.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight Italic’), local(‘SourceSansPro-ExtraLightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6PCsapai9JN_dpv7KtlunNg.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 200;
src: local(‘Source Sans Pro ExtraLight Italic’), local(‘SourceSansPro-ExtraLightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6GLvoADUPo08d8_TfMCzMpg.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* vietnamese */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 300;
src: local(‘Source Sans Pro Light Italic’), local(‘SourceSansPro-LightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6E78GtRp3lhchupCJNw8t58.woff2) format(‘woff2’);
unicode-range: U+0102-0103, U+1EA0-1EF1, U+20AB;
}
/* latin-ext */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 300;
src: local(‘Source Sans Pro Light Italic’), local(‘SourceSansPro-LightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6Lpx497t94oDua8KfAL9f-E.woff2) format(‘woff2’);
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: ‘Source Sans Pro’;
font-style: italic;
font-weight: 300;
src: local(‘Source Sans Pro Light Italic’), local(‘SourceSansPro-LightIt’), url(https://fonts.gstatic.com/s/sourcesanspro/v9/fpTVHK8qsXbIeTHTrnQH6MAjkyiewWYrWZc50I8hK7I.woff2) format(‘woff2’);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
greytocolour · Member · Apr 14, 2016 at 9:11 am
Copy link
Thanks for your help. However, I don’t have the option to download plugins, it doesn’t even appear in my WP Admin.
princesse10011 · Member · Apr 14, 2016 at 9:13 am
Copy link
In this case, I’m sorry but I don’t have another idea. You could ask your hoster to insert:

<link href=’https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,200,200italic,300,300italic,600′ rel=’stylesheet’ type=’text/css’>

into your <head> area.

Best regards
greytocolour · Member · Apr 14, 2016 at 9:16 am
Copy link
Ok. Thanks for your help.
galois · Member · Apr 14, 2016 at 12:25 pm
Copy link
@princesse10011: On WordPress.com you can’t add/use
a) plugins
b) @font-face

@tscarlettblog: open a new thread on CSS Section.
https://en.forums.wordpress.com/forum/css-customization#postform

No items found.