Content fields

9 posts by 2 authors in: Forums > CMS Builder
Last Post: May 17   (RSS)

By MercerDesign - May 16

Hi, this sounds a bit tricky but I have an area on a page that could have a background image or content text. So if a background image is loaded up they won't be able to put content text in place, but if they want content text a background image won't be able to be loaded up. I need to limit it to image or text, not both. How can I do that? I sort of need to do it in the editor screen.

By JeffC - May 16

Have you seen the ShowHide Dependent Fields plugin? I think this could work for you.

Create a dropdown field with two values:

Image Box
Text Box

When the cmsAdmin selects Image Box you show an image upload field and hide the text box.
When the cmsAdmin selects Text Box you show the text box and hide the image upload.

Jeff

By MercerDesign - May 16

Brilliant, thank you, I'll have a look.

I have another question, I'm using the fullpage.js to create slides so am using a multi-record to create the slides. But I need to set a class on each slide, I can do this using a textfield area and that works but I want it to work dynamically, so the first slide has one class then the second and third slides onwards have a different class. Have you go any ideas how I can do that?

By JeffC - May 16

I'm not familiar with fullpage.js

Could you use css? 

<!doctype html>
<html>
<head>

<style>

div {
height: 100px;
width: 100px;
background: yellow;
}
		
div:first-of-type {
background: red;
}

</style>

</head>

<body>

<div>box 1</div>
<div>box 2</div>
<div>box 3</div>
<div>box 4</div>

</body>
</html>
Jeff

By MercerDesign - May 16

I have installed the plugin and have it showing the two options but when you select an option it doesn't show that field, they are both hidden so that's working but they just don't show when you select one.

By MercerDesign - May 17

I can but I need to tell the first slide to use one css style and the rest to use another, so the slide needs to pull in a style, a bit like the add/remove javascript function.

By JeffC - May 17 - edited: May 17

Using a css selector should take care of it. 

Set the css for all the slides. Something like:

.slide {
background: red;
}

Then set a separate style to alter the first slide only

.slide:first-of-type {
background: yellow;
}

In your js or html you apply the .slide class to all of the records. The first slide will have a yellow background, all the others will be red.

Jeff

By JeffC - May 17 - edited: May 17

Regarding the ShowHide plugin – I'll take a look at your code if you post it here. I'll try to sort it for you, but it may be one for the experts :)

Jeff