Joomla Templates Club 406,261 posts

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#193022

Hello,

How can I adjust the size of the font in the contact form and the text that is left of it?

I’ve tried: http://www.joomlart.com/forums/topic/changing-font-size-and-type-for-contact-us-form/ but this was not working.

and a second question; on my site http://www.sleutelverhalen.nl there is a lot of white space between the sections ‘over ons’ and ‘kosten’

How can I remove the white space?

Regards,
Marnix

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515603

Hi

To enlarge the font size in contact form you can add to the custom.css file this line of code

.onepage.contact {
font-size:14px!important;}

<blockquote>and a second question; on my site http://www.sleutelverhalen.nl there is a lot of white space between the sections ‘over ons’ and ‘kosten'</blockquote>

Could you explain better how it should be ? if you check the main menu it is working fine page is correctly loaded by the menu item

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515606

Cool! Thanks for the code, it’s perfect!

The white space is probably because I use two white modules in a row? See screenshot

I’ve an extra question, if you look at my site you will see a module called ‘Voorbeelden’ with the gray background, but actually I want the same red background as the ‘OUR PORTFOLIO’ in de demo website.

How can I use that particular background?

Thanks for the help!!

---

Attachments:

1. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#515609

<em>@orientation 402200 wrote:</em><blockquote>
I’ve an extra question, if you look at my site you will see a module called ‘Voorbeelden’ with the gray background, but actually I want the same red background as the ‘OUR PORTFOLIO’ in de demo website.

How can I use that particular background?

Thanks for the help!!</blockquote>
It would be helpful if you could temporarily set your site to “Development Mode” and “Optimize CSS’ to “No” within your Template Manager–General settings.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515613

<blockquote>I’ve an extra question, if you look at my site you will see a module called ‘Voorbeelden’ with the gray background, but actually I want the same red background as the ‘OUR PORTFOLIO’ in de demo website.</blockquote>

You need to change the pattern file name in the template.css file for retro theme

/templates/ja_onepage/css/themes/retro/template.css

.portfolio {
background: url(../../../images/themes/retro/pattern-3.gif) repeat left top;
box-shadow: 0 0 5px rgba(0,0,0,0.25) inset;
}

Check your images name in theme/yourtheme/images folder

Hope was clear

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515700

Where can I find “Optimize CSS’ to “No”? I’ve searched for hours but I can’t find it… :((

And I’ve found the code for .portfolio where I can change the pattern file name, but section on my website is called: ‘Voorbeelden’. Where can I find that code for changing the pattern?

Again, thanks for the help!

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515703

Hi

<blockquote>Where can I find “Optimize CSS’ to “No”? I’ve searched for hours but I can’t find it…</blockquote>

Extensions >> Template Manager >> Your default template >> General Tab

<blockquote>And I’ve found the code for .portfolio where I can change the pattern file name, but section on my website is called: ‘Voorbeelden’. Where can I find that code for changing the pattern?</blockquote>

.portfolio is the css role assigned to the module

/templates/ja_onepage/css/themes/retro/template.css open the file and check for this code

.portfolio {
background: url(../../../images/themes/retro/pattern-3.gif) repeat left top;
box-shadow: 0 0 5px rgba(0,0,0,0.25) inset;
}

check in your templatesja_onepageimagesthemesretro the pattern-3.gif image if it is the orange you need or change the css with the image name you prefer

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515727

Ok, sorry, but now I’m getting confused. There is no option in the General tab to set ‘Optimize CSS’ to ‘No’. See enclosed screenshot

I understand that .portfolio is the css role assigned to the module. But I don’t use the module Portfolio, they are all unpublished.
I’ve created a couple new moduleswith ‘custom html’ as type and I want for each different module an other background/pattern.

I don’t think that I can do that in only the .portfolio code…

Please help… 🙂

---

Attachments:

1. 

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515730

Ok

Please send me via Private Message a super user account login i will try to take a look at your configuration and try to make changes needed

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515732

Done!
Thanks!

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515735

If you check your module now it has a background image different

This image background is given to the module by the css class suffix (.portfolio ) that i added to your custom-html module in Options > Advanced Options > Module Class Suffix

If you open this file /templates/ja_onepage/css/themes/retro/template.css you will see

.portfolio {
background: url(../../../images/themes/retro/pattern-4.gif) repeat left top;
box-shadow: 0 0 5px rgba(0,0,0,0.25) inset;
}

pattern4.gif is the image used as background by the .portfolio css class so if you want to change your module background change the image in that file with your customized image

Hope was enough clear

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515739

Thanks, yes it was clear for me now, but if I change the pattern-4.gif also the ‘hero-unit’ module changed. And thats is not ok. I want the ‘hero-unit’ with the blue pattern and the other module the red pattern…

Now it changes both modules…

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#515741

Make a new css style . portfolio1 change the background to it and assign it to the new module or vice versa

1 user says Thank You to pavit for this useful post

1. orientation

[orientation Friend orientationJoin date: October 2013Posts: 13Downloads:0Uploads:4 Thanks: 5 Thanked: 1 times in 1 posts]

#515743

I’ve created:

.portfolio1 {
background: url(../../../images/themes/retro/pattern-5.gif) repeat left top;
box-shadow: 0 0 5px rgba(0,0,0,0.25) inset;
}

And in the Module Class Suffix of the ‘Voorbeelden’ module I’ve assigned it to portfolio1, but now I get a grey background while the patter-5.gif is the red pattern…

I feel a little bit stupid that I cannot get it working, >:(>:(>:(

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#515836

Hi orientation,

Pavit’s codes are great. You just need to leave a space before the module class suffix text “portfolio1“, the background of Voorbeelden will display fine then.

1 user says Thank You to phong nam for this useful post

1. orientation

[Author]

Posts