Different image for french version

kumarangopi 13 Jan, 2012

Hi there

We are using Chronoforms V3.1 in Joomla 1.5. We are providing forms in English and French. I am able to show the French version by using Mutlilanguage option of that form. My question is that in English we are using back ground image for the form which would have text in english(back ground iamge). How to replace this image in french version? Any ideas please?

Gr

GreyHead 14 Jan, 2012

Hi kumarangopi,

If you are adding the image in the Form HTML then you can set the image name (or the path to the image with the multi-language plug-in.

Bob

ku

kumarangopi 14 Jan, 2012

Bob:

Thanks for your reply. I have tried following ways but didnt work:

Method 1:
In english box:
enter-to-win-bg=enter-to-win-bg

In french box:
enter-to-win-bg=you-could-win-fr

Method 2:
In english box:
enter-to-win-bg.jpg=enter-to-win-bg.jpg

In french box:
enter-to-win-bg.jpg=you-could-win-fr.jpg

Any ideas please?

Gr

GreyHead 15 Jan, 2012

Hi kumarangopi,

Yes, and what do you have in the Form HTML?

I just ran a simple test to check the method and it works OK for me.

I use a Custom element with

<img src='images/#IMAGE#' />

and then put #IMAGE#=joomla_black.gif in the Multi-language plug-in. The image then displays OK in my form.

Bob

ku

kumarangopi 15 Jan, 2012

Bob:

English version Image is being used in CSS.


<div id="entertowin_wrapper">

Corresponding CSS:
div#entertowin_wrapper {
    background: url("../../../images/enter-to-win-bg.jpg") no-repeat scroll center top transparent;
    height: 767px;
}

How about now?

Gr

GreyHead 15 Jan, 2012

Hi kumarangopi,

Where do you have the CSS?

CSS in a Load CSS action in the form On Load event is 'translated' correctly.

Bob

ku

kumarangopi 15 Jan, 2012

Bob:

We have added layout.css. Please suggest how to add the same in form html and if we add like that image replace works well?

Thanks

Gr

GreyHead 15 Jan, 2012

Hi kumarangopi,

Use a Load CSS action in the form On Load event.

Bob

ku

kumarangopi 15 Jan, 2012

Bob:

You mean onload event for html body like below:

<body onload="load()">

or

<form onLoad=""id="Form1">

Gr

GreyHead 15 Jan, 2012

Hi kumarangopi ,

No, neither of those. I mean the On Load event in your form. It's on the Code tab is you are using the Easy Form Wizard; the Events tab if you use the Advanced Wizard.

Bob

ku

kumarangopi 16 Jan, 2012

Bob:

Okay. I have used that class in on load CSS.

Used something like below in onload event:

div#entertowin_wrapper
{
	background:url(../images/#IMAGE#) no-repeat top center;
	height:767px;
}

And #IMAGE#=test.jpg in Multilanguage options.

But in the front end, image is not showing up. When checked in firebug, test.jpg is not replaced.

i.e that code is still like this:

  background: url("../images/#IMAGE#") no-repeat scroll center top transparent;

Where I am going wrong?

Gr

GreyHead 16 Jan, 2012

Hi kumarangopi,

What is the order of the actions in the On Load event. I think it needs to be:

Multi-language action(s)
Load CSS
Show HTML

Bob

Bob

ku

kumarangopi 16 Jan, 2012

Bob:

I am not sure that I understand you. I am using following CSS class alone in onload CSS box:

div#entertowin_wrapper
{
   background:url(../images/#IMAGE#) no-repeat top center;
   height:767px;
}

Please find attached screenshot. Let me know if I am wrong

Gr

GreyHead 16 Jan, 2012

Hi kumarangopi ,

My apologies, I had forgotten that you were using ChronoForms v3.1 - it's a bit old now. In that case this method won't work (it needs CFv4).

Instead you have to use PHP in the CSS box to check the language and show the correct CSS.

Apologiea again.

Bob

ku

kumarangopi 16 Jan, 2012

Bob:

Not a problem. I would use PHP and change CSS or use Image src directly instead of CSS.

Thanks a lot for your continuous reply. I appreciate your commitment.