DPCalendar

**Rajoz** · 03/08/2014, 18h12

Re : DPCalendar

Bonjour Turandot,

Le code pour les boutons est identique sur ton site, sur le site de démo de DPCalendar et sur mon site de test :

Code HTML:

<i class="icon-calendar" title="Aller à"></i>
...
<i class="icon-print" title="Imprimer"></i>

La différence c'est que je n'ai pas vu dans ton template (dans template.css et custom.css) la définition des icônes icon-calendar ni icon-print qui font partie de la police IcoMoon.
Ces icônes sont définies dans le template.css de Protostar et aussi dans un fichier de Joomla! : media/jui/css/icomoon.css

Pour pouvoir utiliser ces icônes tu peux essayer trois méthodes :

1) Ajouter dans index.php du template dans le <head> après la ligne <jdoc:include type="head"> (là où devraient se trouver les appels à template.css et custom.css) une des deux lignes suivantes :

Code HTML:

<link rel="stylesheet" href="/joomla33/media/jui/css/icomoon.css" type="text/css" />
ou
<link href="<?php echo $this->baseurl; ?>/media/jui/css/icomoon.css" rel="stylesheet" type="text/css" />

2) Faire un couper/coller du contenu de icomoon.css à la fin de ton custom.css. Il faut aussi modifier les adresses d'appel aux polices (ligne 3 à 7) puisqu'elles sont en relatif et que l'appel ne se fera plus du même endroit :

Code:

@font-face {    font-family: 'IcoMoon';
    src: url('media/jui/fonts/IcoMoon.eot');
    src: url('media/jui/fonts/IcoMoon.eot?#iefix') format('embedded-opentype'),
        url('media/jui/fonts/IcoMoon.svg#IcoMoon') format('svg'),
        url('media/jui/fonts/IcoMoon.woff') format('woff'),
        url('media/jui/fonts/IcoMoon.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

3) Faire un import

Copier le fichier media/jui/css/icomoon.css dans templates/montemplate/css/icomonn.css
Copier tout le répertoire (et son contenu) media/jui/fonts dans templates/montemplate/fonts
Ajouter sur la première ligne de custom.css : @import url('icomoon.css');

Comme je ne sais pas quel template tu utilises, j'ai testé sans problème ces trois méthodes avec Beez3 (qui n'intègre pas de base les icônes IcoMoon et qui a donc le même problème avec DPCalendar).

Amicalement,
Rajoz

**Turandot** · 04/08/2014, 12h34

Re : DPCalendar

Bonjour,

Merci pour toutes ces infos...
Au point 1, j'ai copié la 1ère ligne <link rel="stylesheet" href="/joomla33/media/jui/css/icomoon.css" type="text/css" />
Point 2 fait...
Point 3 fait...

Si vous regardez maintenant le site http://joom33.clubapal.com/joomla33/...y=4&view=month
je crois que cela fonctionne... donc j'ai bien fait mes devoirs.

J'aurais une autre question pour vous toujours en rapport avec DPCalendar. Sur la page d'accueil, on voit un compteur de jours à droite, y aurait-il un moyen de le centrer?

Merci, Diane
Le Template utilisé est siteground-j16-42.

Diane

**Rajoz** · 04/08/2014, 15h28

Re : DPCalendar

Bonjour Diane,

On dirait que je ne suis pas bien expliqué, en fait j'avais proposé trois méthodes différentes pour essayer celle qui marchait le mieux. Il suffisait d'en mettre en oeuvre une seule. C'est un peu redondant d'avoir "fait" les trois. Essaye d'en enlever deux... ça devrait continuer à marcher.

J'ai trouvé le template chez SiteGround, il s'appelle City View. Le thème anthracite s'adapte très bien pour un site de photographie. Ce qui est un peu dommage dans ce template, c'est qu'il ne soit pas "responsive" (adaptatif). C'est à dire qu'il ne s'adaptera pas aux petits écrans des smartphones et tablettes que beaucoup d'internautes utilisent de nos jours.

Pour le compteur, je pense avoir trouvé une solution. Essaye de mettre à la fin du custom.css :

Code:

.dpcalendar_next {
    width: 100%;
    text-align: center;
}
.countdown.hasCountdown {
    display: inline-table;
}

Amicalement,
Rajoz

**Turandot** · 04/08/2014, 20h18

Re : DPCalendar

Bonjour,

J'ai placé les lignes à la fin du custom.css amis cela ne fonctionne pas, le compteur ne se centre pas.

Je vous envoie l'intégral du fichier default.php du mod_dpcalendar counter. Peut-être cela peut-il vous aider à m'aider, j'ai enlevé une partie car je ne voulais pas avoir de backlink. J'aurais voulu voir le titre de référence mais sans lien et je n'ai pas compris comment faire ni d'ailleurs comment le centrer. Diane

<?php
/**
* @package DPCalendar
* @author Digital Peak http://www.digital-peak.com
* @copyright Copyright (C) 2007 - 2014 Digital Peak. All rights reserved.
* @license http://www.gnu.org/licenses/gpl.html GNU/GPL
*/
defined('_JEXEC') or die();

DPCalendarHelper::loadLibrary();

ob_start();
?>
{{#events}}
{y<}{yn} {yl}{y>}{o<}{on} {ol}{o>}{w<}{wn} {wl}{w>}{d<}{dn} {dl}{d>}{h<}{hn} {hl}{h>}{m<}{mn} {ml}{m>}{s<}{sn} {sl}{s>}
<div style="clear: both">

<a href= " {{{BackLink}}}"> {{title}}</a> {{{description}}}

</div>

{{/events}} {{^events}} {{emptyText}} {{/events}}ob_start();
<?php
$output = ob_get_contents();
ob_end_clean();

$data = array();
$targetDate = 0;
$title = '';
if ($item != null)
{
$data[] = $item;
$d = DPCalendarHelper::getDate($item->start_date, $item->all_day);
$targetDate = $d->format('Y', true) . "," . ($d->format('m', true) - 1) . "," . $d->format('d', true) . "," . $d->format('H', true) . "," .
$d->format('i', true) . ",0";
$title = $item->title;
}

$tmp = clone JComponentHelper::getParams('com_dpcalendar');
$tmp->set('event_date_format', $params->get('date_format', 'm.d.Y'));
$tmp->set('event_time_format', $params->get('time_format', 'g:i a'));

$layout = preg_replace('#\r|\n#', '', DPCalendarHelper::renderEvents($data, $output, $tmp));

$output = $params->get('output_now',
'{{#events}}Event happening now: {{date}} <a href="{{{backLink}}}">{{title}}</a>{{#maplink}} Join us at [<a href="{{{maplink}}}" target="_blank">map</a>]{{/maplink}}{{/events}}{{^events}}{{emptyText}}{{/events}}');
$expiryText = preg_replace('#\r|\n#', "", DPCalendarHelper::renderEvents($data, $output, $tmp));

$document = JFactory::getDocument();
$document->addScript(JURI::base() . 'components/com_dpcalendar/libraries/jquery/ext/jquery.countdown.min.js');
$document->addStyleSheet(JURI::base() . 'components/com_dpcalendar/libraries/jquery/ext/jquery.countdown.css');

$targetId = "dpcountdown-" . $module->id;

$labels = array(
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_YEARS'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_MONTHS'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_WEEKS'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_DAYS'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_HOURS'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_MINUTES'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_SECONDS')
);
$labels1 = array(
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_YEAR'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_MONTH'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_WEEK'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_DAY'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_HOUR'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_MINUTE'),
JText::_('MOD_DPCALENDAR_COUNTER_LABEL_SECOND')
);

$code = "// <![CDATA[ \n";
$code .= " dpjQuery(document).ready(function() {\n";
$code .= " var targetDate = new Date(" . $targetDate . ");\n";
$code .= " dpjQuery('#" . $targetId . "').countdown({until: targetDate, \n";
$code .= " description: '" . str_replace('\'', '\\\'', $title) . "', \n";
$code .= " layout: '" . str_replace('\'', '\\\'', $layout) . "', \n";
$code .= " labels: ['" . implode("','", $labels) . "'], \n";
$code .= " labels1: ['" . implode("','", $labels1) . "'], \n";
$code .= " format: 'dHMS'});\n";
$code .= "});\n";
$code .= "// ]]>\n";
$document->addScriptDeclaration($code);
?>
<div class="dpcalendar_next">
<div id="<?php echo $targetId;?>" class="countdown">
<?php echo JText::_("MOD_DPCALENDAR_COUNTER_JSERR");?>
</div>
</div>

**Rajoz** · 05/08/2014, 08h44

Re : DPCalendar

Bonjour Diane,

Dans le custom.css il manque les '.' devant dpcalendar_next et countdown.hasCountdown :

Code:

.dpcalendar_next {    width: 100%;
    text-align: center;
}
.countdown.hasCountdown {
    display: inline-table;
}

Le . est important, il indique au CSS qu'il s'agit d'une classe c'est à dire que dans le html il y a par exemple un code du type :

Code HTML:

<div class="dpcalendar_next">

Dans cet exemple, le style défini dans le CSS (width: 100% et text-align: center) pour cette classe dpcalendar_next va s'appliquer au div.

Amicalement,
Rajoz

**Turandot** · 05/08/2014, 11h19

Re : DPCalendar

Bonjour,

Vous avez tout à fait raison et ça fonctionne très bien.
Serait-ce possible de faire la même chose pour le module recherche soit centré?

Merci, Diane

**Rajoz** · 05/08/2014, 11h58

Re : DPCalendar

Bonjour Diane,

Pour le module recherche, il faut ajouter à custom.css :

Code:

.search {
    text-align: center;
}

(gaffe au point

)

Amicalement,
Rajoz

**Turandot** · 05/08/2014, 12h32

Re : DPCalendar

Bonjour,

Oui j'ai fait attention au point mais là c'est vrai cela ne fonctionne pas. Et ce n'est pas nécessairement le texte que je veux centrer mais la petite boîte rectangulaire dans laquelle est écrit le mot recherche.

Merci, Diane

**Rajoz** · 05/08/2014, 12h55

Re : DPCalendar

Bonjour,

Je ne vois pas le code indiqué sur le site dans le fichier /joomla33/templates/siteground-j16-42/css/custom.css
A-t-il été bien ajouté et dans le bon fichier ?

Amicalement,
Rajoz

**Turandot** · 05/08/2014, 13h14

Re : DPCalendar

Bonjour,

J'avais oublié d'enregistrer!!!!

Ça fonctionne maintenant...

Dernier point, savez-vous si le titre du club, tout en haut, pourrait se centrer?

Diane

**Rajoz** · 05/08/2014, 13h38

Re : DPCalendar

Bonjour,

Pour centrer le titre du club, il faut ajouter à custom.css :

Code:

header h1 a, header h1 a:link, header h1 a:visited, header h1 a:hover {
    padding: 0;
}

Explication : dans template.css il y a ligne 107 un padding: 0 0 0 20px; (marge interne à gauche) qui décale le titre de 20 pixels vers la droite. En mettant cette marge à 0, le titre reviendra à sa place.

Cette fois y a pas de point

Amicalement,
Rajoz

**Turandot** · 05/08/2014, 16h39

Re : DPCalendar

Extraordinaire!

Vous êtes vraiment des amours tous de Joomla.

Ciao, Diane

DPCalendar

[RÉGLÉ] DPCalendar

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Commentaire

Annonce

Partenaire de l'association