SWIPER.JS seems to be the most modern touch friendly swiper out there right now. Handles finger swiping better than others I've seen. 

Source: https://github.com/nolimits4web/swiper

Premise: You have some kind of related products slider and want to display four products and have prev/next arrows outside of the slide container.

This example also changes the basic angle bracket arrows to Font Awesome icons.

Working example: https://applesofgold.com/plain-14k-gold-women-s-cross-pendant-cr-6.html

Both the "suggested chains" and "related products" use this method.

Head Tag

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/11.0.5/swiper-bundle.min.css" integrity="sha512-rd0qOHVMOcez6pLWPVFIv7EfSdGKLt+eafXh4RO/12Fgr41hDQxfGvoi1Vy55QIVcQEujUE1LQrATCLl2Fs+ag==" crossorigin="anonymous" referrerpolicy="no-referrer" />

<style>
	.swiper-button-next-unique, .swiper-button-prev-unique {
		color: #728735 !important;
		margin: auto;
	}
	.swiper-button-next-unique::after, .swiper-button-prev-unique::after {
			content: "" !important;;
	}
</style>

Body

<section class="o-layout o-layout--justify-center">

<mvt:comment> ## previous button ## </mvt:comment>

<div class="o-layout__item u-width-1 u-text-center" style="padding: 0; display: flex; align-items: center;">
	<div class="swiper-button-prev-unique" ><i class="fa-duotone fa-solid fa-square-caret-left fa-3x"></i></div>
</div>

<div class="o-layout__item u-width-10 u-text-center" style="padding: 0;">
	<div class="swiper mySwiper">
	<div class="swiper-wrapper" style="display: flex; align-items: center;">

			<div class="swiper-slide">
				Slide 1 Content
			</div>

			<div class="swiper-slide">
				Slide 2 Content
			</div>

			<div class="swiper-slide">
				Slide 3 Content
			</div>

			<div class="swiper-slide">
				Slide 4 Content
			</div>

			<div class="swiper-slide">
				Slide etc Content
			</div>
		</div>

	</div>
</div>


</section>

Foot

<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/11.0.5/swiper-bundle.min.js" integrity="sha512-Ysw1DcK1P+uYLqprEAzNQJP+J4hTx4t/3X2nbVwszao8wD+9afLjBQYjz7Uk4ADP+Er++mJoScI42ueGtQOzEA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
	var swiper = new Swiper(".mySwiper", {
	  navigation: {
		nextEl: ".swiper-button-next-unique",
		prevEl: ".swiper-button-prev-unique",
	  },
		loop: true,
		slidesPerView: 1,
		spaceBetween: 30,
		slidesPerGroup: 1,
		slidesPerGroupSkip: 1,
		breakpoints: {
			600: {
			slidesPerGroup: 1,
				  slidesPerView: 1,
				spaceBetween: 20,
				slidesPerGroup: 1,
			},
			768: {
			slidesPerGroup: 3,
				slidesPerView: 3,
				spaceBetween: 30,
				slidesPerGroup: 1,
			},
			1024: {
			slidesPerGroup: 3,
				slidesPerView: 4,
				spaceBetween: 30,
				slidesPerGroup: 1,
			}
	}
	});
</script>