Template and k2 gets messed up after update - Part 3: Page 2

Template and k2 gets messed up after update - Part 3

starlight

A ) Yes, that fixed it. But can you make the text above the video centered as well (like the other site), because now its going all the way out to the side.

D ) I have added it. The links are correct, but the back to top button is still the same, and now the big button text has also been affected. Its supposed to be white, also when hoovered.

aman204

starlight You may check now for A) and D) as have added CSS for the same

starlight

aman204 Yes, that looks good. I was going to check why the YT video had black bars on the top and the bottom, but for some reason, after saving the article, without any change in the code, without enabling any editor, the video is not displaying.

This is the embed code: <div class="videoWrapper"><i-frame src=//www.youtube.com/embed/KHD2b7gXLEI?rel=0&modestbranding=1" frameborder="0"allowfullscreen="allowfullscreen"></iframe></div>

What can be the issue?

aman204

starlight but for some reason, after saving the article, without any change in the code, without enabling any editor, the video is not displaying.

There is syntax error in specific code snippet due to which it isnt rendering. You may make the code structure right with changing to iframe as seen in screenshot

starlight

aman204 I see. I just did so, but after saving it adds the "-" between "i" and "frame" again automatically.

saguaros

starlight

It due to RS Firewall component on your site, check its manual here: https://www.rsjoomla.com/support/documentation/rsfirewall-user-guide/frequently-asked-questions/scrambled-tags-iframe-becomes-i-frame.html

starlight

saguaros Thx, that was helpful!

I see that there have been added black bars to top and the bottom of the video. The embed code does not include this as it is responsive. Is there a css override to fix this?

teitbite

starlight Hi. Problem with bars at top and bottom is because there is no way for CSS to be prepared for resizing. So the default code is prepared for size 16:9. If the video is even slightly bigger in height or weight than it will show those bars. You may play with the padding value in this code:

.videoWrapper {
    padding-bottom: 56.25% !important;
}

but it may fix one video and break (add black bars) in another if they are not equal size.

starlight

teitbite Thx, that solved the issue!

Aman gave me a code to make the paragraph text bigger, and that worked. But I just noticed that the text here was not affected, is there another code I can add to change size of this text: http://www.finnislam.no/finnes-gud/finnes-det-en-gud

aman204

starlight But I just noticed that the text here was not affected, is there another code I can add to change size of this text:

Try change this :

div.itemFullText p {font-size: 16px !important;}

div.itemFullText p, div.itemFullText ol li{font-size: 16px !important;}

starlight

aman204 Thx. That worked!

On the other sites there is something that is overriding the font type. I wanted to make the font similar on the three sites. When I look at the preview in theme magic, I don't see the font being changed on finnveien.no and muhammed.no.

aman204

starlight When I look at the preview in theme magic, I don't see the font being changed on finnveien.no and muhammed.no.

The font in all the three sites is coming from bootstrap CSS file due to which font selected in thememagic isnt appearing from BODY attribute which also varies in one of the site. To have it consistent across all sites, Try add this to custom.css file :

body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif !important;}

and change font-family accordingly

starlight

aman204 Thx, that solved it, almost. I see there is also different vertical spacing on the sites, do you have a css to adjust spacing between the paragraph text marked in the circle in the last screenshot?

aman204

starlight I see there is also different vertical spacing on the sites, do you have a css to adjust spacing between the paragraph text

Try add this in custom.css file for all sites and adjust value accordingly :

div.itemFullText p{line-height:1.5 !important;}

« Previous Page