Buy me a coffee

Add Image to Scrolling Block

#1. First, add text to the Scrolling Block (you can add any text because we will use text to change this text then).

Add Image To Scrolling Block 01 Min

#2. Use this code to Page Header Code Injection (Page where you use Scrolling Block)

<script src=""></script>
.m-scroll {
  display: flex;
  position: relative;
  width: 100%;
  height: 90px;
  margin: auto;
  overflow: hidden;
  z-index: 1;

 .m-scroll__title {
      display: flex;
      position: absolute;
      top: 0;
      left: 0;
      align-items: center;
      justify-content: flex-start;
      width: 100%;
      height: 100%;
      white-space: nowrap;
      transition: all 0.7s ease;
.m-scroll__title > div {
          display: flex;
          animation: scrollText 40s infinite linear;
        .m-scroll__title img {
            margin: 0 20px 6px;
   .m-scroll__title     h1 {
          margin: 0;
          font-size: 1.7rem;
          color: #000;
          transition: all 1.4s ease;
     display: flex;
/*div:hover {
  animation-play-state: paused;
@keyframes scrollText {
  from   { transform: translateX(0%); }
  to { transform: translateX(-50%); }
const imgUrl = '';
$(document).ready(() => {
    const textBlock = $('.sqs-block.marquee-block.sqs-block-marquee');
    const htmlWords = `
    <div class="m-scroll">
  <div class="m-scroll__title">
        ${ => `${w}<img width="20px" src="${imgUrl}"/>`).join('')}
        ${ => `${w}<img width="20px" src="${imgUrl}"/>`).join('')}

Add Image To Scrolling Block 02 Min

#3. Result

Add Image To Scrolling Block 03 Min

#4. Note
Add text/image in this position. If you use 1 text only, you should repeat twice (same as the code in the screenshot).

Add Image To Scrolling Block 04 Min

if you use 3 different text, enter something like this

Add Image To Scrolling Block 05 Min

this is the Text color

Add Image To Scrolling Block 06 Min