diff --git a/css/imagefield_slideshow.css b/css/imagefield_slideshow.css
new file mode 100644
index 0000000..2bd2dfa
--- /dev/null
+++ b/css/imagefield_slideshow.css
@@ -0,0 +1,24 @@
+.imagefield_slideshow-wrapper {
+  position: relative;
+}
+
+.imagefield_slideshow-prev {
+  position: absolute;
+  left: 0;
+  font-size: 0;
+  background-image: url(../img/previous.png);
+  height: 50px;
+  width: 50px;
+  background-repeat: no-repeat;
+}
+
+.imagefield_slideshow-next {
+  position: absolute;
+  position: absolute;
+  right: 0;
+  font-size: 0;
+  background-image: url(../img/next.png);
+  height: 50px;
+  width: 50px;
+  background-repeat: no-repeat;
+}
diff --git a/imagefield_slideshow.libraries.yml b/imagefield_slideshow.libraries.yml
index e82a445..933eccc 100644
--- a/imagefield_slideshow.libraries.yml
+++ b/imagefield_slideshow.libraries.yml
@@ -1,5 +1,8 @@
 imagefield_slideshow:
   version: 1.x
+  css:
+    theme:
+      css/imagefield_slideshow.css: {}
   js:
     js/imagefield_slideshow.js: {}
     /libraries/jquery.cycle/jquery.cycle.all.js: {}
diff --git a/imagefield_slideshow.module b/imagefield_slideshow.module
index bc070fd..b92254b 100644
--- a/imagefield_slideshow.module
+++ b/imagefield_slideshow.module
@@ -37,6 +37,7 @@ function imagefield_slideshow_theme() {
     'imagefield_slideshow' => array(
       'variables' => array(
         'url' => NULL,
+        'prev_next' => NULL,
       ),
     ),
   );
diff --git a/img/next.png b/img/next.png
new file mode 100644
index 0000000..66bdff7
Binary files /dev/null and b/img/next.png differ
diff --git a/img/previous.png b/img/previous.png
new file mode 100644
index 0000000..fce202b
Binary files /dev/null and b/img/previous.png differ
diff --git a/js/imagefield_slideshow.js b/js/imagefield_slideshow.js
index b6891ab..dd48e94 100644
--- a/js/imagefield_slideshow.js
+++ b/js/imagefield_slideshow.js
@@ -9,15 +9,21 @@
 
   $(document).ready(function () {
 
-    jQuery('.imagefield_slideshow').cycle({
+    var slideshow = jQuery('.imagefield_slideshow').cycle({
       fx: drupalSettings.imagefield_slideshow.effect,
       pause: drupalSettings.imagefield_slideshow.pause,
-      prev: '#prev',
-      next: '#next'
     });
 
-    console.log(drupalSettings.imagefield_slideshow);
+    // If prev/next setting is enabled.
+    if (drupalSettings.imagefield_slideshow.prev_next) {
+      jQuery('.imagefield_slideshow-prev').click(function() {
+        slideshow.cycle('prev');
+      });
+      jQuery('.imagefield_slideshow-next').click(function() {
+        slideshow.cycle('next');
+      });
+    }
 
   });
 
-})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
+})(jQuery, Drupal, drupalSettings);
diff --git a/src/Plugin/Field/FieldFormatter/ImagefieldSlideshowFieldFormatter.php b/src/Plugin/Field/FieldFormatter/ImagefieldSlideshowFieldFormatter.php
index 5d43aac..4421215 100644
--- a/src/Plugin/Field/FieldFormatter/ImagefieldSlideshowFieldFormatter.php
+++ b/src/Plugin/Field/FieldFormatter/ImagefieldSlideshowFieldFormatter.php
@@ -95,6 +95,7 @@ class ImagefieldSlideshowFieldFormatter extends ImageFormatterBase implements Co
       'imagefield_slideshow_style' => 'large',
       'imagefield_slideshow_style_effects' => 'fade',
       'imagefield_slideshow_style_pause' => '1',
+      'imagefield_slideshow_prev_next' => TRUE,
     ) + parent::defaultSettings();
   }
 
@@ -165,6 +166,12 @@ class ImagefieldSlideshowFieldFormatter extends ImageFormatterBase implements Co
       '#options' => $image_pause,
       '#description' => 'Should image be paused on hover.',
     ];
+    $element['imagefield_slideshow_prev_next'] = [
+      '#title' => $this->t('Enable Prev & Next button'),
+      '#type' => 'checkbox',
+      '#default_value' => $this->getSetting('imagefield_slideshow_prev_next'),
+      '#description' => $this->t('This will show the Prev and Next button for slideshow.'),
+    ];
     return $element;
   }
 
@@ -197,6 +204,11 @@ class ImagefieldSlideshowFieldFormatter extends ImageFormatterBase implements Co
       $summary[] .= t('Pause :' . $image_style_pause);
     }
 
+    $image_prev_next = $this->getSetting('imagefield_slideshow_prev_next');
+    if ($image_prev_next) {
+      $summary[] .= t('Prev & Next :' . $image_prev_next);
+    }
+
     return $summary;
   }
 
@@ -230,6 +242,7 @@ class ImagefieldSlideshowFieldFormatter extends ImageFormatterBase implements Co
     $elements[] = array(
       '#theme' => 'imagefield_slideshow',
       '#url' => $image_uri_values,
+      '#prev_next' => $this->getSetting('imagefield_slideshow_prev_next')
     );
 
     // Attach the image field slide show library.
@@ -239,6 +252,7 @@ class ImagefieldSlideshowFieldFormatter extends ImageFormatterBase implements Co
     $drupalSettings = [
       'effect' => $this->getSetting('imagefield_slideshow_style_effects'),
       'pause' => $this->getSetting('imagefield_slideshow_style_pause'),
+      'prev_next' => $this->getSetting('imagefield_slideshow_prev_next'),
     ];
     $elements['#attached']['drupalSettings']['imagefield_slideshow'] = $drupalSettings;
 
diff --git a/templates/imagefield-slideshow.html.twig b/templates/imagefield-slideshow.html.twig
index afeb44c..25b2001 100644
--- a/templates/imagefield-slideshow.html.twig
+++ b/templates/imagefield-slideshow.html.twig
@@ -13,8 +13,14 @@
  * @ingroup themeable
  */
 #}
-<div class="imagefield_slideshow">
+<div class="imagefield_slideshow-wrapper">
+  <div class="imagefield_slideshow">
     {% for key,value in url %}
-        <img src="{{ value }}" />
+      <img src="{{ value }}" />
     {% endfor %}
+  </div>
+  {% if prev_next %}
+    <div class="imagefield_slideshow-prev">PREV</div>
+    <div class="imagefield_slideshow-next">NEXT</div>
+  {% endif %}
 </div>