- This topic has 18 replies, 2 voices, and was last updated 8 years, 4 months ago by Mahesh.
-
AuthorPosts
-
July 18, 2016 at 2:13 am #95600AntoonParticipant
Hi,
I have the following problems with the footer:
– i have made a table and i want to center it.
– is there a way to get calibri font as default font
and that the font shows on a iPhone or android phone.
– How can i change the fontsize from this text:
“Volg het Rode Kruis afd. Beuningen”Link to the site:
rodekruisbeuningen.nl
thanks for the response.
Antoon
July 18, 2016 at 11:17 am #95618MaheshParticipant@antoon: I checked your site and it says “Maintenance mode is enabled”.
Let me know further.Regards,
MaheshJuly 18, 2016 at 1:59 pm #95627AntoonParticipantHi Mahesh,
Maybe you can reach the site with this link:
rodekruisbeuningen.nl/home
Regards,
Antoon
July 18, 2016 at 4:26 pm #95637MaheshParticipant@antoon: Thanks, now I can check the site. Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:
/* Center the table */ .footer table { margin: auto; } /* Set calibri font as default */ body { font-family: "Calibri"; } /* Change font-size of the text */ .footer > p { font-size: 20px; }
Regards,
MaheshJuly 18, 2016 at 10:53 pm #95666AntoonParticipant@mahesh: Thanks
The footer is more to the right but still not centered and how to get calibri to show up on a iPhone or android phone.
July 19, 2016 at 11:14 am #95714MaheshParticipant@antoon:
Hi Antoon,By footer do you mean Volg het Rode Kruis afd. Beuningen text??
Let me know further.Android and iPhone only supports ttf font, so you’ll need to manually upload calibri.ttf font to your site and then add that font-family in CSS and use it. For example
@font-face { font-family: myCalibri; src: url(path_to_font) format('truetype'); } body { font-family: myCalibri, "Calibri"; }
Hope this helps.
Regards,
MaheshJuly 19, 2016 at 2:43 pm #95732AntoonParticipantHi Mahesh,
Yes i did mean Volg het Rode Kruis afd. Beuningen text as footer.
i add above to CCS but nothing has changed.
and the table in the footer is still not in the center.Regards,
AntoonJuly 19, 2016 at 4:20 pm #95735MaheshParticipant@antoon:
Hi Antoon,The above CSS is not complete it is just an example. For that you’ll need to first upload the ttf font in to your site’s folder somewhere way
yoursite/wp-content/uploads
and then in add the following Custom CSS:@font-face { font-family: myCalibri; src: url(yoursite/wp-content/uploads/calibri.ttf) format('truetype'); } body { font-family: myCalibri, "Calibri"; }
Note: Please change the path in the above CSS to your site’s relative path.
Do you mean to center everything in the footer? Even the table’s content? If so add the following CSS:
.footer, .footer table td, th { text-align: center; }
Let me know if any problem.
Regards,
MaheshJuly 21, 2016 at 8:12 pm #95879AntoonParticipantThe above post is not working.
Next problem i have add a “bar in the footer and when i take a look on my phone the bar is not changing to the size of the responsive site. what is wrong and how can i fix this? is there a plugin to solve my problem? if i buy the pro version on how many sites can i place the theme? and can is solve the problem with this?Regards,
AntoonJuly 22, 2016 at 9:46 am #95907MaheshParticipant@antoon: Have you uploaded the font file to you site? If not please upload it first. Then get the full path to that font file and place in the CSS src, then only it will work.
And as for the bar in the footer, you are using table for that, and for you have inline style defining the width of the table, which is causing the responsive issue. You should not use fix width as far as you want the responsive design.
I don’t know the exact plugin, but you can get an appropriate one from https://wordpress.org/plugins/Buying a Pro version theme, you can use it for as many site as you’ve owned unless its for the 3rd party.
Regards,
MaheshJuly 22, 2016 at 2:32 pm #95918AntoonParticipant@mahesh: Yes i have uploaded the font file.
the font in the footer bar has changed, but the table beneath is still in a different font.For the bar is there a way to remove the bar in responsive mode?
Regards,
AntoonJuly 22, 2016 at 5:23 pm #95927MaheshParticipant@antoon:
I checked your site and for some reasons, I still can’t see the Calibri font in the mobile devices, may be the issue of server caching. Please try clearing server cache and check again.
And for removing the footer bar in responsive mode:
First you’ll need to put a id(footer-bar) for the table displaying the bar and use the following CSS:@media screen and (max-width: 480px) { #footer-bar { display: none; } }
Regards,
MaheshJuly 22, 2016 at 6:32 pm #95931AntoonParticipant@Mahesh: thanks for the code for above it works.
Maybe there is something wrong in my CSS:
#header-menu #access { background: none #569DDB} #header-menu ul.menu a { color: #fff; font-family: "Calibri"; font-weight: bold; font-size: 18px; } #site-generator td { text-align: center; } .footer { background: #569DDB; font-family: Calibri; font-side: 18px; color: #FFF; } .footer td {padding: 0; text-align: left; text-valign: top; align: center} #header-menu ul.menu li:hover > a, #header-menu ul.menu a:focus { background: none transparent; text-decoration: underline; color: #FFFFFF; } #header-menu ul.menu li { border-right: 1px solid #569DDB; } /* Center the table */ .footer table { margin: auto; } /* Set calibri font as default */ body { font-family: "Calibri"; } /* Change font-size of the text */ .footer > p { font-size: 20px; } #site-generator { background-color: #569DDB; color: #eee; } #site-generator a { color: #fff;} @font-face { font-family: myCalibri; src: url(http://rodekruisbeuningen.nl/wp-content/uploads/calibri.ttf) format('truetype'); } body { font-family: myCalibri, "Calibri"; } @media screen and (max-width: 680px) { #footer-bar { display: none; } }
i hope you can help to solve my font problem.
July 24, 2016 at 5:55 pm #96008AntoonParticipant@mahesh: i have changed my footer.
Is there a way to get the white headers aligned with the text beneath.
I mean “wat kun jij doen?” with “Geef je gift” etc.I hope you can/will help me again.
Thanks
Regards,
Antoon
July 25, 2016 at 9:43 am #96023MaheshParticipant@antoon:
Hi Antoon,Please use the following CSS:
@font-face { font-family: myCalibri; src: url(http://rodekruisbeuningen.nl/wp-content/uploads/calibri.ttf) format('truetype'); } /* Set calibri font as default */ body { font-family: myCalibri, "Calibri"; } #header-menu #access { background: none #569DDB; } #header-menu ul.menu a { color: #fff; font-family: myCalibri, "Calibri"; font-weight: bold; font-size: 18px; } #site-generator td { text-align: center; } .footer { background: #569DDB; font-family: myCalibri, "Calibri"; font-size: 18px; color: #FFF; } .footer td { padding: 0; text-align: left; vertical-align: top; align: center; } #header-menu ul.menu li:hover > a, #header-menu ul.menu a:focus { background: none transparent; text-decoration: underline; color: #FFFFFF; } #header-menu ul.menu li { border-right: 1px solid #569DDB; } /* Center the table */ .footer table { margin: auto; } /* Change font-size of the text */ .footer > p { font-size: 20px; } #site-generator { background-color: #569DDB; color: #eee; } #site-generator a { color: #fff; } @media screen and (max-width: 680px) { #footer-bar { display: none; } }
Hope this helps.
And I don’t quite get your second issue, I didn’t find “Geef je gift” text on the page.
Regards,
MaheshJuly 25, 2016 at 10:40 pm #96044AntoonParticipantThe text in the footer is now:
Wat kun jij doen?
> Geef een gift
> Word donateur
> Word vrijwilliger
> Wat kun je nog meer doen?What i want to see:
Wat kun jij doen?
> Geef een gift
> Word donateur
> Word vrijwilliger
> Wat kun je nog meer doen?Thanks your answer for the last post and already for this post.
Regards,
Antoon
July 26, 2016 at 9:44 am #96054MaheshParticipantJuly 26, 2016 at 1:56 pm #96067July 26, 2016 at 2:53 pm #96070 -
AuthorPosts
- The topic ‘problems with footer’ is closed to new replies.