How to add carousel control for image gallery

Hi there,

Select the Carousel block, then click the Add Navigation Controls option on the toolbar:
https://cln.sh/ZX4PR8JpXb2RNlW0kjNl

Hi.

Click the three dots at the top right of the page and switch to Code editor. Copy the following code and paste it in your page. Switch back to Visual editor to view the block.

<!-- wp:generateblocks-pro/carousel {"uniqueId":"34e191f1","styles":{"\u002d\u002dgb-carousel-slides-per-view":"4","\u002d\u002dgb-carousel-slide-gap":"20px","position":"relative"},"css":".gb-carousel-34e191f1{\u002d\u002dgb-carousel-slide-gap:20px;\u002d\u002dgb-carousel-slides-per-view:4;position:relative}","tagName":"div","htmlAttributes":{"data-slides-per-view":"4","data-space-between":"20px","data-loop":"true"}} -->
<div class="gb-carousel gb-carousel-34e191f1" data-slides-per-view="4" data-space-between="20px" data-loop="true" data-carousel-id="34e191f1"><!-- wp:generateblocks-pro/carousel-items {"uniqueId":"86e8d4c6","tagName":"div"} -->
<div class="gb-carousel-items"><!-- wp:generateblocks-pro/carousel-item {"uniqueId":"b16d8901","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"8844ca5a","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-8844ca5a{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-8844ca5a" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"372291dc","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"a81e3241","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-a81e3241{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-a81e3241" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"c2aeddac","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"b0a6c7fb","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-b0a6c7fb{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-b0a6c7fb" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"281bd753","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"96f1f421","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-96f1f421{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-96f1f421" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"2d8bae06","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"69dc7998","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-69dc7998{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-69dc7998" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"7e83d980","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"27df7979","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-27df7979{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-27df7979" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"2bdff44f","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"83e1ad98","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-83e1ad98{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-83e1ad98" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item -->

<!-- wp:generateblocks-pro/carousel-item {"uniqueId":"a0d2e5d1","tagName":"div"} -->
<div class="gb-carousel-item"><!-- wp:generateblocks/media {"uniqueId":"76364115","tagName":"img","styles":{"height":"300px","maxWidth":"100%","objectFit":"cover","width":"100%","display":"block","borderTopLeftRadius":"8px","borderTopRightRadius":"8px","borderBottomRightRadius":"8px","borderBottomLeftRadius":"8px"},"css":".gb-media-76364115{display:block;height:300px;max-width:100%;object-fit:cover;width:100%;border-radius:8px}","htmlAttributes":{"alt":"","title":"11","src":"/wp-content/uploads/2026/01/11.jpg"}} -->
<img class="gb-media-76364115" alt="" title="11" src="/wp-content/uploads/2026/01/11.jpg"/>
<!-- /wp:generateblocks/media --></div>
<!-- /wp:generateblocks-pro/carousel-item --></div>
<!-- /wp:generateblocks-pro/carousel-items -->

<!-- wp:generateblocks/element {"uniqueId":"0683d341","tagName":"div","styles":{"position":"absolute","top":"50%","left":"20px","transform":"translateY(-50%)","zIndex":"10"},"css":".gb-element-0683d341{left:20px;position:absolute;top:50%;transform:translateY(-50%);z-index:10}"} -->
<div class="gb-element-0683d341"><!-- wp:generateblocks-pro/carousel-control {"uniqueId":"fb00db15","controlType":"previous","iconOnly":true,"tagName":"button","htmlAttributes":{"data-carousel-control":"prev"},"styles":{"display":"flex","alignItems":"center","justifyContent":"center","width":"48px","height":"48px","backgroundColor":"#ffffff","color":"#000000","borderTopWidth":"1px","borderRightWidth":"1px","borderBottomWidth":"1px","borderLeftWidth":"1px","borderTopStyle":"solid","borderRightStyle":"solid","borderBottomStyle":"solid","borderLeftStyle":"solid","borderTopColor":"#e0e0e0","borderRightColor":"#e0e0e0","borderBottomColor":"#e0e0e0","borderLeftColor":"#e0e0e0","borderTopLeftRadius":"50%","borderTopRightRadius":"50%","borderBottomRightRadius":"50%","borderBottomLeftRadius":"50%","\u0026:is(:hover, :focus)":{"backgroundColor":"#fafafa","color":"#000000"},".gb-carousel-control-icon svg":{"width":"20px","height":"20px","fill":"currentColor"}},"css":".gb-carousel-control-fb00db15{align-items:center;background-color:#ffffff;color:#000000;display:flex;height:48px;justify-content:center;width:48px;border:1px solid #e0e0e0;border-radius:50%}.gb-carousel-control-fb00db15:is(:hover,:focus){background-color:#fafafa;color:#000000}.gb-carousel-control-fb00db15 .gb-carousel-control-icon svg{width:20px;height:20px;fill:currentColor}"} -->
<button class="gb-carousel-control gb-carousel-control-fb00db15 gb-carousel-control--previous" data-carousel-control="prev"><span class="gb-carousel-control-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M165.66,202.34a8,8,0,0,1-11.32,11.32l-80-80a8,8,0,0,1,0-11.32l80-80a8,8,0,0,1,11.32,11.32L91.31,128Z" /></svg></span></button>
<!-- /wp:generateblocks-pro/carousel-control --></div>
<!-- /wp:generateblocks/element -->

<!-- wp:generateblocks/element {"uniqueId":"87b00268","tagName":"div","styles":{"position":"absolute","top":"50%","right":"20px","transform":"translateY(-50%)","zIndex":"10"},"css":".gb-element-87b00268{position:absolute;right:20px;top:50%;transform:translateY(-50%);z-index:10}"} -->
<div class="gb-element-87b00268"><!-- wp:generateblocks-pro/carousel-control {"uniqueId":"9767ef2c","controlType":"next","iconOnly":true,"tagName":"button","htmlAttributes":{"data-carousel-control":"next"},"styles":{"display":"flex","alignItems":"center","justifyContent":"center","width":"48px","height":"48px","backgroundColor":"#ffffff","color":"#000000","borderTopWidth":"1px","borderRightWidth":"1px","borderBottomWidth":"1px","borderLeftWidth":"1px","borderTopStyle":"solid","borderRightStyle":"solid","borderBottomStyle":"solid","borderLeftStyle":"solid","borderTopColor":"#e0e0e0","borderRightColor":"#e0e0e0","borderBottomColor":"#e0e0e0","borderLeftColor":"#e0e0e0","borderTopLeftRadius":"50%","borderTopRightRadius":"50%","borderBottomRightRadius":"50%","borderBottomLeftRadius":"50%","\u0026:is(:hover, :focus)":{"backgroundColor":"#fafafa","color":"#000000"},".gb-carousel-control-icon svg":{"width":"20px","height":"20px","fill":"currentColor"}},"css":".gb-carousel-control-9767ef2c{align-items:center;background-color:#ffffff;color:#000000;display:flex;height:48px;justify-content:center;width:48px;border:1px solid #e0e0e0;border-radius:50%}.gb-carousel-control-9767ef2c:is(:hover,:focus){background-color:#fafafa;color:#000000}.gb-carousel-control-9767ef2c .gb-carousel-control-icon svg{width:20px;height:20px;fill:currentColor}"} -->
<button class="gb-carousel-control gb-carousel-control-9767ef2c gb-carousel-control--next" data-carousel-control="next"><span class="gb-carousel-control-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z" /></svg></span></button>
<!-- /wp:generateblocks-pro/carousel-control --></div>
<!-- /wp:generateblocks/element -->

<!-- wp:generateblocks/element {"uniqueId":"04c545b3","tagName":"div","styles":{"position":"absolute","bottom":"30px","left":"50%","transform":"translateX(-50%)","zIndex":"10"},"css":".gb-element-04c545b3{bottom:30px;left:50%;position:absolute;transform:translateX(-50%);z-index:10}"} -->
<div class="gb-element-04c545b3"><!-- wp:generateblocks-pro/carousel-pagination {"uniqueId":"b01f297e","styles":{".gb-carousel-dot":{"width":"12px","height":"12px","backgroundColor":"rgba(255,255,255,0.5)","\u0026.is-active":{"backgroundColor":"#ffffff"}}},"css":".gb-carousel-pagination-b01f297e .gb-carousel-dot{width:12px;height:12px;background-color:rgba(255,255,255,0.5);\u0026.is-active:[object Object]}","tagName":"nav","htmlAttributes":{"data-pagination-type":"bullets"}} -->
<nav class="gb-carousel-pagination gb-carousel-pagination-b01f297e" data-pagination-type="bullets"><span class="gb-carousel-pagination-content"></span></nav>
<!-- /wp:generateblocks-pro/carousel-pagination --></div>
<!-- /wp:generateblocks/element --></div>
<!-- /wp:generateblocks-pro/carousel -->