Hoewel je het uiterlijk van de audiospeler op het Tumblr-dashboard niet kunt wijzigen, kun je het uiterlijk van de audiospeler op je eigen blog wijzigen met behulp van het thema en de aanpassingsopties van Tumblr. U moet enige ervaring hebben met HTML en CSS, aangezien u uw Tumblr-thema moet aanpassen om de grootte van de audiospeler te wijzigen. Hoe de audiospeler precies wordt aangepast, verschilt enigszins tussen thema's, omdat elke ontwikkelaar Tumblr-thema's anders schrijft. De Tumblr-variabelen voor audioposts zijn echter altijd hetzelfde, wat het proces van het vinden van de CSS die moet worden gewijzigd, vereenvoudigt.
Open de aanpassingspagina voor uw Tumblr-thema. Klik op de link "HTML bewerken"; deze bevindt zich rechts van je Tumblr-themaminiatuur, direct onder de naam van het thema.
Druk op "Ctrl-F" om een zoekopdracht te starten en voer "{block:audio}" in. Dit brengt je naar het deel van het thema waar de maker de instellingen voor audioposts heeft ingevoerd. Bepaal welke CSS-klasse de ontwikkelaar heeft gebruikt om de audiospeler te dimensioneren. Als de post zich bijvoorbeeld in een div-element bevindt, ziet u het attribuut 'class="audio-player",' waarbij "audio-player" de naam van de klasse is.
Zoek naar de klasnaam met een punt ervoor, b.v. ".geluids speler". De punt voor de naam is hoe een CSS-stylesheet een klasse identificeert. Deze zoekopdracht brengt u naar het juiste gedeelte van de stylesheet om te bewerken. Het ziet er ongeveer zo uit, met de haakjes ingevuld met CSS:
.geluids speler {}
Sommige thema's gebruiken extern gekoppelde stylesheets die u niet kunt bewerken. Deze zien eruit als:
Als dit het geval is voor uw thema, voegt u het kenmerk "stijl" toe aan de tag die de audiospeler aanpast. Hiermee kunt u uw eigen CSS toevoegen zonder de bestaande stylesheet te wijzigen. Een tag kan zowel een 'class'-attribuut als een 'style'-attribuut hebben. Dit zou er ongeveer zo uitzien:
Voer de eigenschap "width:" in voor de klasse in de stylesheet of voor het stijlkenmerk voor de bevattende tag. Als de stylesheet al een eigenschap "width" heeft, pas die dan aan; voeg geen tweede toe. U kunt ook de hoogte bepalen met de eigenschap "hoogte". Als u de stylesheet aanpast, ziet uw CSS er ongeveer zo uit:
.audiospeler { breedte: 100px; hoogte:25px; }
Als u de wijzigingen aan het kenmerk "style" aan de tag heeft toegevoegd, is de syntaxis:
Klik op "Voorbeeld bijwerken" om te zien hoe deze wijzigingen van invloed zijn op uw thema. Thema's kunnen complex zijn en wijzigingen kunnen er anders uitzien dan u verwacht. Het kan verschillende pogingen kosten om de audiospeler precies zo te krijgen als u wilt.
Klik op "Opslaan" wanneer u klaar bent om de themawijzigingen in uw blog door te voeren.
Tips
Wanneer je muziek van een andere bron plaatst, zoals een Soundcloud-afspeellijst, kun je de grootte van de audiospeler in die code wijzigen; het wordt niet gewijzigd door je Tumblr-instellingen.
Waarschuwingen
Dit artikel verwijst naar thema-opties die beschikbaar waren in januari 2014; opties kunnen veranderen met toekomstige updates van de Tumblr-website.
