Keyword

How to style every single extra field?

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
12 years 9 months ago - 12 years 9 months ago #101031 by theant
Hello
I need to style differently every single extra field, is it possible?

Please Log in or Create an account to join the conversation.

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
12 years 9 months ago #101032 by theant
Replied by theant on topic Re: How to style every single extra field?
Is it not possible?

Please Log in or Create an account to join the conversation.

More
12 years 9 months ago #101033 by william white
Replied by william white on topic Re: How to style every single extra field?
The extra fields are designed to display in a two column format.
You can find this in either item.php or category_item.php of your override directory if you are using an override. (see docs above for k2 templating)
In order to style each extra field differently you will have to address the extra fields one at a time and apply the style you want in the item.php and the css files
Try creating a variable and address it like this $custom = $this->item->extra_fields; and then addressing extra fields for the item like echo $custom[1]->value; with your own divs around them

Please Log in or Create an account to join the conversation.

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
12 years 9 months ago #101034 by theant
Replied by theant on topic Re: How to style every single extra field?
Thanks a lot William White and sorry for the delay, I din't get the forum notification for your reply.
Please, can you help me to understand where to try creating a variable and address it like this $custom = $this->item->extra_fields; ?

Please Log in or Create an account to join the conversation.

More
12 years 9 months ago #101035 by william white
Replied by william white on topic Re: How to style every single extra field?
this would go in either your item.php or your category_item.php of a k2 template override

Please Log in or Create an account to join the conversation.

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
12 years 8 months ago #101036 by theant
Replied by theant on topic Re: How to style every single extra field?
It seems too much difficult for me, I'm a designer :(

I suppose this is the part of item.php :
  <?php if($this->item->params->get('itemExtraFields') && count($this->item->extra_fields)): ?>
	  <!-- Item extra fields -->
	  <div class="itemExtraFields">
	  	<h3><?php echo JText::_('K2_ADDITIONAL_INFO'); ?></h3>
	  	<ul>
			<?php foreach ($this->item->extra_fields as $key=>$extraField): ?>
			<?php if($extraField->value): ?>
			<li class="<?php echo ($key%2) ? "odd" : "even"; ?> type<?php echo ucfirst($extraField->type); ?> group<?php echo $extraField->group; ?>">
				<span class="itemExtraFieldsLabel"><?php echo $extraField->name; ?>:</span>
				<span class="itemExtraFieldsValue"><?php echo $extraField->value; ?></span>
			</li>
			<?php endif; ?>
			<?php endforeach; ?>
			</ul>
	    <div class="clr"></div>
	  </div>
	  <?php endif; ?>

but i have no idea how to do.

Please Log in or Create an account to join the conversation.

More
12 years 4 months ago - 12 years 4 months ago #101037 by Peter
Replied by Peter on topic Re: How to style every single extra field?
I have a solution... might not be perfect, but it seems to work.

In item.php on line 262, I changed this:
<span class="itemExtraFieldsValue"><?php echo $extraField->value; ?></span>

to this:
<span class="itemExtraFieldsValue <?php echo $extraField->name; ?>"><?php echo $extraField->value; ?></span>

You'll want to avoid using spaces in the names of your Extra Fields.

After doing this, you can then add classes to your CSS like this:

.itemExtraFieldsValue .NameOfYourExtraField {

}

Please Log in or Create an account to join the conversation.

More
12 years 4 months ago #101038 by william white
Replied by william white on topic Re: How to style every single extra field?
@peter - Nice!
the new syntax of xtra fields allows a lot

Please Log in or Create an account to join the conversation.

More
12 years 2 weeks ago #101039 by Michael Lundie
Replied by Michael Lundie on topic Re: How to style every single extra field?
This is really useful - cheers! If you want a little more control over the resulting CSS class you could use the 'alias' value instead.
Log in  or Create an account to join the conversation.

More
11 years 10 months ago - 11 years 10 months ago #101040 by Roman
Replied by Roman on topic Re: How to style every single extra field?
Hi everyone!
I have another problem. How to style every single select type value in extrafields? For example: option value 1 - style 1, option value 2 - style 2 and so on... How to get thase values 1,2,3..?

Please Log in or Create an account to join the conversation.

  • Krikor Boghossian
  • Krikor Boghossian's Avatar
  • Offline
  • Platinum Member
More
11 years 10 months ago #101041 by Krikor Boghossian
Replied by Krikor Boghossian on topic Re: How to style every single extra field?

JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)

Please Log in or Create an account to join the conversation.

More
11 years 9 months ago #101042 by Itay Maor
Replied by Itay Maor on topic Re: How to style every single extra field?
@Michael Lundie or someone else ...
Can you tell me what to add in CSS file?
I tried some version of:
span.itemExtraFieldsValue.status
(status is 1 of the alias extra field i have)

Please Log in or Create an account to join the conversation.

More
11 years 9 months ago #101043 by EFFIDOC
Replied by EFFIDOC on topic Re: How to style every single extra field?
hello
i had the same issue and I manage to add the alias of the extrafield in the class property of the li tag

on item.php l 256
<li class="<?php echo ($key%2) ? "odd" : "even"; ?>   type<?php echo ucfirst($extraField->type); ?> group<?php echo $extraField->group; ?>">
change in
<li class="<?php echo ($key%2) ? "odd" : "even"; ?> <?php echo $extraField->alias; ?> type<?php echo ucfirst($extraField->type); ?> group<?php echo $extraField->group; ?>">

then i change the css

Please Log in or Create an account to join the conversation.

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
11 years 9 months ago - 11 years 9 months ago #101044 by theant
Replied by theant on topic Re: How to style every single extra field?
hello Krikor

I changed line 262 to

<span class="itemExtraFieldsValue <?php echo $extraField->alias; ?>"><?php echo $extraField->value; ?></span>

so now I get the right code to style every single extrafield value. Great!
how to if I want to style the label too?

I have a drop-down selection with 4 values (audio, video, text, picture)
If I want to style every value (adding a different icon), how to?
I don't understand your suggestion in other thread:
<?php if($this->item->params->get('itemExtraFields') && count($this->item->extra_fields)): ?>
<?php if(isset($this->item->extraFields->EXTRAFIELDALIASHERE->value)): ?>
<?php echo $this->item->extraFields->EXTRAFIELDALIASHERE->name; ?>
<?php echo $this->item->extraFields->EXTRAFIELDALIASHERE->value; ?>
<?php endif; ?>
<?php endif; ?>

just replace EXTRAFIELDALIASHERE and add some markup


best regards

Please Log in or Create an account to join the conversation.

  • Krikor Boghossian
  • Krikor Boghossian's Avatar
  • Offline
  • Platinum Member
More
11 years 9 months ago #101045 by Krikor Boghossian
Replied by Krikor Boghossian on topic Re: How to style every single extra field?

just replace EXTRAFIELDALIASHERE and add some markup


Every extrafield has an alias (See it's form), you have to insert its alias.

For the label you can use something like
<label class="itemExtraFieldsLabe label<?php echo $extraField->alias; ?>">...

JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)

Please Log in or Create an account to join the conversation.

  • theant
  • theant's Avatar Topic Author
  • Offline
  • Premium Member
More
11 years 9 months ago #101046 by theant
Replied by theant on topic Re: How to style every single extra field?
Thanks a lot for reply.

So it is ok with:
<span class="itemExtraFieldsLabel <?php echo $extraField->alias; ?>"><?php echo $extraField->name; ?>:</span>
<span class="itemExtraFieldsValue <?php echo $extraField->alias; ?>"><?php echo $extraField->value; ?></span>


What I really don't undertand is the other thing about the drop-down selection with 4 values styling.

where to insert your code?

and, for my 4 values it shoul be:

<?php if($this->item->params->get('itemExtraFields') && count($this->item->extra_fields)): ?>
<?php if(isset($this->item->extraFields->audio->value)): ?>
<?php echo $this->item->extraFields->audio->name; ?>
<?php echo $this->item->extraFields->audio->value; ?>
<?php endif; ?>
<?php endif; ?>
<?php if(isset($this->item->extraFields->video->value)): ?>
<?php echo $this->item->extraFields->video->name; ?>
<?php echo $this->item->extraFields->video->value; ?>
<?php endif; ?>
<?php endif; ?>
<?php if(isset($this->item->extraFields->picture->value)): ?>
<?php echo $this->item->extraFields->picture->name; ?>
<?php echo $this->item->extraFields->picture->value; ?>
<?php endif; ?>
<?php endif; ?>
<?php if(isset($this->item->extraFields->text->value)): ?>
<?php echo $this->item->extraFields->text->name; ?>
<?php echo $this->item->extraFields->text->value; ?>
<?php endif; ?>
<?php endif; ?>

Right?

Please Log in or Create an account to join the conversation.

  • Krikor Boghossian
  • Krikor Boghossian's Avatar
  • Offline
  • Platinum Member
More
11 years 9 months ago #101047 by Krikor Boghossian
Replied by Krikor Boghossian on topic Re: How to style every single extra field?
Yes it appears correct.

JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)

Please Log in or Create an account to join the conversation.