Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
The text is already inside circles, what do you mean?
Hi,
thank you for your quick response:)
The text is alredy in two circles which do not have picture inside. My website is http://www.wylotkinawarszawe.pl
I would like to insert text also to the circles with pictures (in the same style as it is inside the left and right circle without picture).
OR
even more preferable (I do not know if it is feasible) – to add text below the circles with pictures only (in the same style as it is inside the left and right circle without picture).
best
Mateusz
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I would like to insert text also to the circles with pictures (in the same style as it is inside the left and right circle without picture).
Try following Stage 1 and Stage 2 of this guide: http://ww.wp.xz.cn/support/topic/put-test-inside-images-on-home-page
Thank you once again. I think that I followed all the steps from the guideline and it is almost perfect 🙂
It is a little strange that before I emptied my cache in a browser the text was below circles with pictures and inside the circles without pictures. What was missing was that fonts were different than in the first and the last circle and the text was not in the middle (under the circle) – it was a little bit moved to the left. Beside this I think that it looked very good and better than all text in circle – after empting the cache the text moved to the centre of circles – but in hardly visible. Could you help me please and show me how to insert text (in this style) under the circles with pictures only? Because it looks better and is more visible than all the text inside the circles.
Sorry for my confusion of the case 🙂
best
Mateusz
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
In your Child Theme style.css file replace this:
.blog .hentry span.hometitle {
width: 100%;
position: absolute;
top: 73px;
display: table-cell;
font-family: Baskerville, "Playfair Display", "Times New Roman", serif;
font-size: 32px;
font-size: 3.2rem;
font-style: italic;
text-shadow: 0 0 10px #fff;
text-align: center;
line-height: 1.2;
vertical-align: middle;
word-wrap: break-word;
color: #111;
overflow: hidden;
transition: background .4s ease-in-out;
-webkit-transition: background .4s ease-in-out;
-moz-transition: background .4s ease-in-out;
-o-transition: background .4s ease-in-out;
-ms-transition: background .4s ease-in-out;
}
With this:
.blog .hentry span.hometitle {
width: 100%;
top: 73px;
display: table-cell;
font-family: Baskerville, "Playfair Display", "Times New Roman", serif;
font-size: 32px;
font-size: 3.2rem;
font-style: italic;
text-shadow: 0 0 10px #fff;
text-align: center;
line-height: 1.2;
vertical-align: middle;
word-wrap: break-word;
color: #111;
overflow: hidden;
transition: background .4s ease-in-out;
-webkit-transition: background .4s ease-in-out;
-moz-transition: background .4s ease-in-out;
-o-transition: background .4s ease-in-out;
-ms-transition: background .4s ease-in-out;
}
But the text is going to be cut off when the screen resizes smaller.
Thanks a lot for your help. You are right. I changed the website using your previous code 🙂 it is more operatable. I changed color of text and shadow. I have last question – how to make transition in circles with picture. If I’m not mistaken previously the colour of the circles changed into grey when you put a cursor in it. Thank you once again for your help.
best
Mateusz
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Hi Mateusz, could you create a new thread for that question? It helps people searching for solutions in the future, if one issue is discussed per thread.
Thanks 🙂
Hi Andrew,
Thank you, you are right – I will create a new thread for this. Once again many thanks for your priceless help.
best 🙂
Mateusz
