Template ITEM LAYOUT/parametre affichage

More
5 years 8 months ago - 5 years 8 months ago #74099 by Teamherve
Bonjour,
Cherchant à personnaliser l’affichage des contenus
- Changer le fond gris des noms d’étiquette
- Changer le fond violet bleu des onglets
Je m’interroge sur cette partie de flexicontent.

CE QUE JE FAIS :
AFFICHAGE DE CONTENU/ TEMPLATES/
Je choisi mon Template ITEM LAYOUT
Et onglet paramètre d’affichage.

Je pensais ici pouvoir personnaliser l’affichage, mais sanssuccès
Style des étiquettes - Style des onglets - Titre de l'article
Même si je change les couleurs dans cette partie, cela n’a pas d’influence sur l’affichage.

Surtout, j
e ne comprends pas ces indications (même traduite en français)

- your content types / items will inherit defaults from here, you may override them inside type (but avoid overriding inside the item)
- setting any parameter below to "Use global", will use default value inside the template's PHP code-  parameters: add more to item.xml ,then inside file: less/item.less use less variables:   @FCI_parameter_name; 
- NOTE: FCC_ for category and FCI_ for itemlayout, EXAMPLE: body  .flexi.label  { color:
@FCI_label_bg_color; }
Où puis-je avoirplus d’information ou documentation sur ce sujet.
Concrètement,doit-on intervenir dans item.xmlet/ou dans less/item.less
Si oui comment parexemple pour étiquette mettre un fond rouge au lieu d’un fond gris 

Merci beaucoup paravance
Attachments:
Last edit: 5 years 8 months ago by Teamherve.

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

More
5 years 8 months ago #74102 by micker
Bonjour cela devrait fonctionner êtes vous sur que votre template est bien affecter à votre type ?
avez vous un liens pour voir ?

FLEXIcontent is Free but involves a very big effort on our part.
Like the our support? (for a bug-free FC, despite being huge extension) Like the features? Like the ongoing development and future commitment to FLEXIcontent?
-- Add your voice to the FLEXIcontent JED listing reviews. Thanks![/size]

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

More
5 years 8 months ago - 5 years 8 months ago #74105 by Teamherve
Bonsoir,
J'ai à nouveau bien verifier.
Le template est bien attribué au type
Quand je suis dans TYPE, j'ai :
mon type     redirection vers la vue flexicontent     le nom de mon template      alias etc...

D'ailleurs si a la place de mon template je met blog pour le type, j'ai bien à l'écran cette modification.

C'est surtout cela que je ne comprends pas. très nul en anglais, et avec un traducteur c'est pas très compréhensif.
- L  parameters: add more to item.xml , then inside file: less/item.less use less variables:   @FCI_parameter_name;
- NOTE: FCC_ for category and FCI_ for item layout, EXAMPLE: body  .flexi.label  { color: @FCI_label_bg_color; }
Last edit: 5 years 8 months ago by Teamherve.

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

More
5 years 8 months ago #74106 by ggppdk
Hello

the (less) parameter that produce CSS are only meant to be shown at template manager
(otherwise the number of CSS files created would be too big or we would need to inject such custom CSS 1 per item which would be ugly)

Solution , please edit these parameter (the LESS parameter) only at template manager ...

Next version of Flexicontent in item edit form and in category edit form and in type form
- will display these parameters (the LESS parameters) as readonly , also showing their inherited value


-- Flexicontent is Free but involves a big effort on our part.
Like the our support? (for a bug-free FC, despite having a long list of functions) Like the features? Like the ongoing development and future commitment to FLEXIcontent?
-- Add your voice to the FLEXIcontent JED listing with a 5-star...

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

More
5 years 8 months ago #74109 by micker
ce qui est expliqué c'est si tu veus rajouter des parametres dans ton template rien avoir avec ton soucis je penses
as tu un lien de test ?

FLEXIcontent is Free but involves a very big effort on our part.
Like the our support? (for a bug-free FC, despite being huge extension) Like the features? Like the ongoing development and future commitment to FLEXIcontent?
-- Add your voice to the FLEXIcontent JED listing reviews. Thanks![/size]

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

More
5 years 8 months ago #74110 by Teamherve
@import 'include/config.less';

/* Presentation Theme : item template CSS file */


/*LESS EXAMPLE variable name: 'FCI_' + parameter name */
/* e.g. 'FCI_' + 'title_color' => 'FCI_title_color' */
body #flexicontent .fc_item_title,
body #flexicontent .fc_item_title a {
color: @FCI_title_color;
}

/* Label styling */

body #flexicontent .flexi.label,
body #flexicontent .desc-title.label {
background-color: @FCI_label_bg_color;
color: @FCI_label_txt_color;
border-radius: @FCI_label_radius*1px;
}

/* TAB styling */

body #flexicontent ul.tabbernav > li a {
border: 1px solid @FCI_tab_bg_color_end;
background-color: @FCI_tab_bg_color_start;
background-image: -webkit-linear-gradient(top, @FCI_tab_bg_color_start , @FCI_tab_bg_color_end);
background-image: linear-gradient(to bottom, @FCI_tab_bg_color_start , @FCI_tab_bg_color_end );
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr= @FCI_tab_bg_color_start , endColorstr= @FCI_tab_bg_color_end );
color: @FCI_tab_title_color;
}

body #flexicontent ul.tabbernav > li.tabberactive a::before {
border-top: 4px solid @FCI_tab_bg_color_end;
}
/* ... NOT USED !!
body #flexicontent ul.tabbernav > li.tabberactive a,
body #flexicontent ul.tabbernav > li.tabberactive a:hover {
background-color: @FCI_tab_bg_color_active;
}*/
body #flexicontent ul.tabbernav > li:hover a {
border: 1px solid darken(@FCI_tab_bg_color_end, 20%);
background-color: darken(@FCI_tab_bg_color_start, 20%);
background-image: -webkit-linear-gradient(top, darken(@FCI_tab_bg_color_start, 20%) , darken(@FCI_tab_bg_color_end, 20%));
background-image: linear-gradient(to bottom, darken(@FCI_tab_bg_color_start, 20%) , darken(@FCI_tab_bg_color_end, 20%) );
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr= darken(@FCI_tab_bg_color_start, 20%) , endColorstr= darken(@FCI_tab_bg_color_end, 20%) );
color: @FCI_tab_title_color;
}


// ***
// *** A row of content
// ***

.flexi.lineinfo {
display: block;
padding: 0;
margin: 0 0 1em;
overflow: hidden;
clear: both;
}


// ***
// *** Allow responsive width while floating
// ***

.tabbertab .flexi.element,
.subtitle1 .flexi.element,
.subtitle2 .flexi.element,
.subtitle3 .flexi.element {
clear: none;
display: block;
float: left;
max-width: 96% !important; /* Allow responsive width while floating */
padding: 0% !important; /* Allow responsive width while floating */
margin: 0.5em 2% 0.5em 2% !important;
}


// ***
// *** POSITIONS: SubtitleN
// ***

.flexi.subtitle1 {}
.flexi.subtitle2 {}
.flexi.subtitle3 {}


// ***
// *** POSITION: Top Block
// ***

.flexi.topblock {
overflow: hidden;
width: 100%;
margin-bottom: 10px;
}
.topblock .flexi.image {
display: block;
float: left;
max-width: 99% !important; /* Allow responsive width while floating */
padding: 0% !important; /* Allow responsive width while floating */
margin-right: 1%;
margin-left: 0%;
line-height: 0px;
border: 0px solid silver;
}
.topblock .flexi.image a {
outline: none;
}
.topblock .flexi.image img {
border: 1px solid white;
}
.topblock .flexi.infoblock {
overflow: hidden;
}


/* infoblock: Field block styling */
.flexi.infoblock {
border: 1px solid silver;
margin: 0 0 10px;
padding: 10px;
}
.infoblock ul.flexi {
margin: 0 !important;
padding: 0 !important;
}
.infoblock ul li.flexi {
padding: 0;
background: none;
min-height: 10px;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
margin: 0%;
zoom: 1;
}


/* Field values into 1 column */
.onecols ul li.flexi {
width: 100%;
}
.onecols .flexi.label {
min-width: 20%;
margin-right: 4%;
margin-bottom: 6px;
}
.onecols .flexi.value {
min-width: 74%;
margin-right: 1%;
}


/* Field values into 2 columns */
.twocols ul li.flexi {
min-width: 48%;
}
.twocols .flexi.label {
min-width: 34%;
margin: 2px 3% 6px 0;
box-sizing: border-box;
}
.twocols .flexi.value {
min-width: 59%;
margin: 2px 4% 6px 0;
box-sizing: border-box;
}


/*
* clearfix, for clearing a block that contains floated elements
* without appending an extra HTML TAG with 'clearfix' class
*/

.group {
overflow: auto !important;
}

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

Moderators: vistamediajoomlacornerggppdk
Time to create page: 0.295 seconds
Save
Cookies user preferences
We use cookies to ensure you to get the best experience on our website. If you decline the use of cookies, this website may not function as expected.
Accept all
Decline all
Essential
These cookies are needed to make the website work correctly. You can not disable them.
Display
Accept
Analytics
Tools used to analyze the data to measure the effectiveness of a website and to understand how it works.
Google Analytics
Accept
Decline