🌍
Français
Bonjour
Katryne a écrit:
Bonjour bonjour !
Qui aurait une petite idée pour cet affichage aléatoire de l'ordre des albums en accueil ? C'est pour donner à chacun sa chance et donner l'impression d'un site en perpétuel renouvellement ! Une piste ?
A ma connaissance aujourd'hui cela n'est pas prévu
je peux te donner des pistes pour développer un plugin mais je connais ta réponse ;-)
Bonjour bonjour !
Qui aurait une petite idée pour cet affichage aléatoire de l'ordre des albums en accueil ? C'est pour donner à chacun sa chance et donner l'impression d'un site en perpétuel renouvellement ! Une piste ?
Merci, mais je ne pense pas : ce code sert à insérer UNE photo prise au hasard dans l'album 56.
Ce que je cherche , c'est afficher aléatoirement l'ordre des albums dans la page de toutes les catégories (chez moi : la page d'accueil)
Bonjour,
essayer [random album=56]
le 56 est le numero de l'album
A très vite
Mouiiii, mais c'est trop compliqué pour moi, je n'y comprends goutte ... Merci encore, c'est l'intention qui compte !!!
Je m'en doutes, je mettais l'accent sur comment récupérer les images au hasard.
Peut etre tu vas pouvoir surcharger l'affichage de la miniature de chaque album ?
Merci de ta suggestion, Benoît, mais ce n'est pas ce que je recherche. Ma page d'accueil est la page de tous les albums. Ce sont les miniatures d'albums que je veux voir afficher au hasard, de tous les albums de 1er niveau. Je ne veux pas ajouter de carrousel d'image ni créer une page d'accueil différente.
Sur ma page d'accueil a chaque (re)chargement 10 images au hasard.
Pour cela, plugin AdditionalPages pour faire ma page d'accueil avec le code suivant
<style type="text/css">
.navbar-contextual { display: none; }
.carousel-item {
height: 100vh;
min-height: 300px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.carousel-caption a {
font-family: 'Lato', sans-serif;
color: #ddd;
font-weight: 900;
text-transform: full-width;
text-decoration: none;
text-shadow: -1px -1px 1px #aaa,
0px 5px 2px rgba(0,0,0,0.5),
5px 5px 6px rgba(0,0,0,0.7),
0px 0px 8px rgba(0,0,0,0.4);
font-size: 3rem;
padding: 1rem 2rem;
border-radius: 5px;
}
.carousel-indicators {
bottom: 2rem;
color: #ddd;
font-weight: 800;
border-radius: 2px;
}
.content-grid, .pt-3, .copyright {display:none;}
</style>
<div id="last10items" class="carousel carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
</ol>
<div class="carousel-inner">
</div>
<a class="carousel-control-prev" href="#last10items" role="button" data-slide="prev">
<span class="fa fa-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Précédent</span>
</a>
<a class="carousel-control-next" href="#last10items" role="button" data-slide="next">
<span class="fa fa-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Suivant</span>
</a>
</div>
<script type="text/javascript">
var pwg_root = '/';
var pwg_api = pwg_root + 'ws.php?format=json&method=pwg.categories.getImages&recursive=true&per_page=10&recursive=true&order=random';
function setHeights() {
if ($('.jumbotron').length > 0) {
var height = window.innerHeight - $('.navbar-main').outerHeight() - $('.jumbotron').outerHeight();
} else {
var height = window.innerHeight - $('.navbar-main').outerHeight();
}
var bottom = window.innerHeight - height + (height * 0.1);
$('#last10items .carousel-inner').css('height', height);
$('#last10items').find('.carousel-caption').css('bottom', bottom + 'px');
}
$.getJSON(pwg_api, function (json) {
var images = json.result.images;
$.each( images, function ( i, image ) {
var src = image.derivatives.xlarge.url; /* replace large with preferred derivative size */
var dheight = image.derivatives.xlarge.height; /* replace large with preferred derivative size */
var name = image.file;
var link = image.categories[0].page_url;
if (i === 0) {
$('#last10items .carousel-indicators').append('<li data-target="#last10items" data-slide-to="' + i + '" class="active"></li>');
$('#last10items .carousel-inner').append('<div class="carousel-item active text-center" style="background-image: url(\'' + src + '\')"><div class="carousel-caption"><a href="/index.php?/categories">Ouvrez les yeux !</a></div></div>');
} else {
$('#last10items .carousel-indicators').append('<li data-target="#last10items" data-slide-to="' + i + '"></li>');
$('#last10items .carousel-inner').append('<div class="carousel-item text-center" style="background-image: url(\'' + src + '\')"><div class="carousel-caption"><a href="/index.php?/categories">Ouvrez les yeux !</a></div></div>');
}
});
$('#last10items').closest('.container').addClass('w-100 h-100 mx-0').removeClass('container');
setHeights();
});
$(window).on('resize', function() {
setHeights();
});
</script>L'appel a l'api qui te renvoie les 10 images au hasard est celui ci :
var pwg_api = pwg_root + 'ws.php?format=json&method=pwg.categories.getImages&recursive=true&per_page=10&recursive=true&order=random';
Tu peux jouer sur le nb d'images, sur l'ordre, sur les albums concernés, etc ..
Bonjour !
Je voudrais un affichage aléatoire à chaque rafraichissement de pages ou toutes les x minutes de l'ordre d'affichage des albums en page d'accueil. Est-ce possible ? Config que je n'aurais pas vue, plugin, astuce, fork ?
v.11.5 https://imagedoc.revestou.fr/