Podczas zabawy z pluginem BuddyPress oraz WordPress zauważyłem, że po aktywacji BuddyPress funkcja get_avatar zwraca tylko i wyłącznie Avatary w niskiej rozdzielczości pomimo wartości, które podawane są w filtrze. Poszperałem troszkę w internecie i znalazłem rozwiązanie.
Krótki kod JavaScirpt wyszukuje wszystkie elementy z klasą avatar i zamienia w linku końcówkę -bpthumb na -bpfull. Daje to fajny efekt ponieważ obrazki w rozdzielczości thumb ładowane są natychmiastowo, a wysoka rozdzielczość ładuje się zaraz po nich i zastępuje je.
Nie zapomnij o załączeniu bibliotek jQuery w sekcji head. Tutaj znajdziesz informacje jak je załączyć.
<script>
jQuery(".avatar").each(function(){
// Replacing the -bpthumb with -bpfull for higher resolution images.
var source = jQuery(this).attr("src");
var startIndex = source.lastIndexOf("-");
var endIndex = source.lastIndexOf(".");
var removeValue = source.substring(startIndex, endIndex);
if("-bpthumb" == removeValue){
var newSource = source.replace(removeValue, "-bpfull");
jQuery(this).attr("src", newSource);
}
});
</script>
Sprawdź jak wygląda to w praktycę. Zapraszam do obejrzenia mojego nowego projektu, który jest paczką inspiracji oraz ciekawych produktów i DIY.
Brak komentarzy:
Prześlij komentarz