Hoewel Blocs levert een zeer nauwkeurige weergave van uw uiteindelijke site terwijl u deze daadwerkelijk ontwerpt, het kan voorkomen dat u snel een voorbeeld van uw site moet bekijken om andere ontwerpaspecten te controleren en te testen, zoals interacties, scroll FX en en animaties. Blocs heeft verschillende ingebouwde preview-opties die zijn ontworpen om u te helpen uw site op een natuurlijkere en uitgebreidere manier te testen.
Voorbeeldmodus in Blocs laat je niet alleen lokaal HTML previews zien, maar het ondersteunt ook previews van PHP. Zolang een pagina de bestandstype ingesteld op PHP in het pagina-instellingen, zal het voorbeeld elke PHP-code weergeven die is toegevoegd via de Code-widget in real time.
In app-voorbeeld
Met in-app-voorbeeld kunt u een voorbeeld van uw site bekijken zoals u dat in een webbrowser zou doen, zonder dat u de hoofdpagina hoeft te verlaten Blocs toepassing. Om de voorbeeldmodus te openen, hoeft u alleen maar links klikken de afspeelknop aan de rechterkant van de breekpuntbediening, of anders met de sneltoets V.
Schakelen tussen breekpunten
Naast de ontwerpmodus heeft de voorbeeldmodus ook toegang tot het hoofdmenu breekpunt controles Deze bedieningselementen kunnen worden gebruikt om snel en gemakkelijk tussen verschillende schermformaten te schakelen om de responsieve kenmerken van uw site te controleren.
Developer tools
In app-preview krijgt u ook toegang tot de krachtige WebKit-tools voor ontwikkelaarinspectie. De inspectietools zijn een geweldige manier om de code van uw site te inspecteren en mogelijke problemen die u tegenkomt op te lossen. Ze zijn toegankelijk via de menuknop in de linkerbovenhoek van het voorbeeldframe.
Of gewoon door rechts klikken elk element op een pagina (in de voorbeeldmodus) en selecteren Inspecteren.
Voorbeeld in browser
Evenals in app-preview, Blocs laat je ook snel een voorbeeld van je site bekijken met een van de browsers die je op je Mac hebt geïnstalleerd. Om eenvoudig een voorbeeld van uw site in een browser te bekijken klik met de rechtermuisknop de voorbeeldknop en selecteer een browser in het pop-upmenu.
U kunt meer lezen over voorbeeldweergave in browsers hier.
Als u problemen heeft met de voorbeeldmodus, of het werkt gewoon niet, dan raden we u aan dit te lezen gids voor probleemoplossing.
Lokaal netwerkvoorbeeld
Het Blocs preview-server is ook toegankelijk vanaf elk apparaat op hetzelfde netwerk als uw Mac. Als de pagina waarvan het voorbeeld wordt bekeken, het bestandstype heeft ingesteld op . Html, dan een kleine knop met een antenne symbool wordt weergegeven in de linkerbovenhoek van het hoofdtoepassingsframe. Als u op deze knop klikt, wordt de lokale netwerk-URL naar het plakbord van uw Mac gekopieerd. Door deze URL in te voeren in een webbrowser op elk apparaat dat is verbonden met hetzelfde netwerk als uw Mac, kunt u een voorbeeld van uw site bekijken en uw site testen op het eigenlijke apparaat.
