This topic has 8 replies, 3 voices, and was last updated 8 years, 10 months ago ago by Jack Richardson
Hello,
I want to make several changes to the fonts on my website. I have been able to make some changes based on another thread on this support forum. This is the code I have added to my custom css so far:
@import url(https://fonts.googleapis.com/css?family="Noto Sans");
@import url(https://fonts.googleapis.com/css?family=Calligraffitti);
body {
font: 14px "Noto Sans", sans-serif !important;
}
h1, h2, h3, h4, h5, h6 {
font-family: Calligraffitti, cursive !important;
}
.article p {
font-size: 14px !important;
}
I do still need help with several other formatting issues:
1- increase font size of the body text on each individual blog post
2- increase font size of all breadcrumbs
3- increase font size of the hyperlinks in all widget areas
4- increase font size of the product availability on each product page
5- increase font size of all headings and body text on the contact page
6- do not show headings (or text listed in #7-9 below) in all uppercase letters
7- change font family on the main menu tabs at the top of every page
8- change font family of product titles of shop page
9- change font family of tab headings on each product page
In addition, I also need a bit of help to make the following changes:
10- delete the copyright and allow me to enter what I want in the copyright widget area (if I add anything to the widget area, it shows up in addition to the default, which shows 2015 as the copyright year)
11- shift the search box to the right so there is white space between it and my logo
12- delete custom tab on all product pages
13- increase line spacing between the price and number of customer reviews on each product page (see product 8737-B as an example – it will show up if you enter 8737-B in the search box)
I know I’m asking for alot here…this forum has been extremely helpful thusfar, and I really do appreciate all the help!
FTP credentials are in private content below. Thanks,
Monique
Hello,
Further to #10 in my first message, I figured out how to delete the original copyright information. The question I have now is how to add a copyright footer that automatically updates the year? I added the following code into my functions.php file:
function comicpress_copyright() {
global $wpdb;
$copyright_dates = $wpdb->get_results("
SELECT
YEAR(min(post_date_gmt)) AS firstdate,
YEAR(max(post_date_gmt)) AS lastdate
FROM
$wpdb->posts
WHERE
post_status = 'publish'
");
$output = '';
if($copyright_dates) {
$copyright = "© " . $copyright_dates[0]->firstdate;
if($copyright_dates[0]->firstdate != $copyright_dates[0]->lastdate) {
$copyright .= '-' . $copyright_dates[0]->lastdate;
}
$output = $copyright;
}
return $output;
}
I got this code from this blog post. I then tried to add the following code to my footer.php file, which only ended up deleting my entire footer:
<?php echo comicpress_copyright(); ?>
Please help clarify what I should be doing to get this working.
Thanks,
Monique
Hello,
1. Use this code in custom.css:
.article-single p {
font-size: 14px !important;
}
2.
#breadcrumb a, #breadcrumb, .back-to{
font-size: 15px !important;
}
3. Please specify what widget areas exactly you mean.
4.
#product-page .product-shop .main-info .stock {
font-size: 15px !important;
}
5.
p {
font-size: 15px !important;
}
.form .formField label {
font-size: 14px;
}
6.
#main-nav > ul > li > a, #products-grid.products_grid .product-grid .product-name a, #tabs li > a {
text-transform: capitalize;
}
7.
#main-nav > ul > li > a {
font-family: Cantata One !important;
}
Write font family you need.
8.
#products-grid.products_grid .product-grid .product-name a {
font-family: open sans !important;
}
Write font family you need.
9.
#tabs li > a {
font-family: open sans !important;
}
Write font family you need.
10. Sorry, but this requires additional customization which is beyond our basic support scope. You may contact some php developer to help you with this issue.
11.
#top-cart {
width: 150px !important;
}
#search {
margin-left: 50px !important;
text-align: right !important;
}
12. Go to Blanco – Theme Settings > Single Product Page and delete the title for “Custom Tab Title” field.
13.
#product-page .product-shop .main-info .price-block {
margin-top: 15px !important;
}
After checking the changes on your site don’t forget to clear browser and server cache.
Regards,
Eva Kemp.
Eva,
That fix alot of the issues, but there were a couple of code snippets that broke the featured products on the home page and the related products on each products page…the products were replaced by red bars and a bunch of dashes. The following 2 code snippets had the same effect (I added each line of code one at a time):
#product-page .product-shop .main-info .stock {
font-size: 15px !important;
and
#main-nav > ul > li > a, #products-grid.products_grid .product-grid .product-name a, #tabs li > a {
text-transform: capitalize;
The following code also made no changes at all to the font on the tabs of each product page or to anything else I could find on the website:
#tabs li > a {
font-family: open sans !important;
}
With regards to #3, all widget areas I am using have this problem:
a- primary widget area
b- product page sidebar
c- first footer widget area
d- second footer widget area
e- third footer
f- fourth footer
I also notice the following (continuing with the numbering from above):
14- The “Contact Info” heading on the contact page has remained very small
15- Would like to change the product description font of the featured products on the main page
16- would like to change the product description font of the related products on each product page
17- when I did add the code for changing the headings from all uppercase, the product titles on each product page were all still uppercase.
Thanks a bunch,
Monique
Hello,
Please show us screenshots what exactly needs to be changed to avoid misunderstanding.
Thank you.
Best regards,
Jack Richardson.
Jack,
Here are the screenshots you requested…
3a- primary widget area (on blog pages):
3b,c,d,e- 1st, 2nd, 3rd and 4th footer areas (appear on all website pages):
changes described in 4, 9 and 17 above:
14- contact info header:
15- featured product and new arrivals font family:
16- related product titles font family:
18- I would like to change the color of the review ratings to red…the grey is barely noticeable:
I hope this clarifies what I am asking,
Thanks!
Monique
Sorry – for some reason those images didn’t appear to work…let’s try again:
3a:
3b,c,d,e:
4, 9 and 17:
14:
15:
16:
18:
Hello,
Here is the css code I’ve added in child style.css:
3a.
.widget_categories .cat-item a, .widget_text .textwidget a {
font-size: 14px !important;
}
3b,c,d,e.
.footer-information a {
font-size: 14px !important;
}
4, 9 and 17.
#product-page .product-shop .main-info .stock {
font-size: 15px !important;
}
#tabs li > a {
font-family: Felipa !important;
}
#product-page .product-shop h1 {
text-transform: capitalize;
}
14.
.block.non-line.contats h5 {
font-size: 20px !important;
}
15, 16.
.product-slider .product-slide .product-name a {
font-family: Felipa !important;
text-transform: capitalize;
}
18.
You need to edit the image file /wp-content/themes/blanco/woocommerce/images/star.png to change rating star color.
Best regards,
Jack Richardson.
You must be logged in to reply to this topic.Log in/Sign up