ForumSpark Support Support Join

Add affiliates....

· 7 months ago · 7 replies · 416

Is there a way to add affiliates to the bottom of the index page of the forum?

That way, we can exchange affiliates with other people....

7 replies

· 7 months ago

Yes, you can add those in Board Templates. You would need to do so using HTML. But this also allows you to cleanly recreate a box with a category title. I’ll share some code later today for a clean affiliates box.

· 7 months ago

This is just something quickly spin up.

Put this in Board Templates:

<div class="affiliate-panel panel">
  <div class="panel__title">
    Our Affiliates
  </div>
  <div class="affiliate-grid">
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 1">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 2">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 3">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 4">
    </a>
  </div>
  <div class="panel__footer">
  </div>
</div>

Put this in your theme CSS:

.affiliate-panel {
  max-width: 1300px;   

  width: 100%;
  margin: 0 auto;     

}

.affiliate-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  padding: 12px;
}

.affiliate-grid img {
  width: 88px;
  height: 31px;
  display: block;
}

.affiliate-grid a {
  display: inline-block;
  transition: transform 0.15s ease;
}

.affiliate-grid a:hover {
  transform: scale(1.05);
}

OP · 7 months ago

Cedric said:

This is just something quickly spin up.

Put this in Board Templates:

<div class="affiliate-panel panel">
  <div class="panel__title">
    Our Affiliates
  </div>
  <div class="affiliate-grid">
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 1">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 2">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 3">
    </a>
    <a href="#" target="_blank" rel="noopener">
      <img src="link" alt="Affiliate 4">
    </a>
  </div>
  <div class="panel__footer">
  </div>
</div>

Put this in your theme CSS:

.affiliate-panel {
  max-width: 1300px;   

  width: 100%;
  margin: 0 auto;     

}

.affiliate-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  padding: 12px;
}

.affiliate-grid img {
  width: 88px;
  height: 31px;
  display: block;
}

.affiliate-grid a {
  display: inline-block;
  transition: transform 0.15s ease;
}

.affiliate-grid a:hover {
  transform: scale(1.05);
}

Thank you! I've got this up on my forum.
@Cedric When using the theme "Navy Blue", it automatically switch's from light mode to dark mode whenever I move from one page to another on the forum now that I've added the affiliates code to my forum. Is that messing with the theme at all?

· 7 months ago

Cat_Lady said:
Thank you! I've got this up on my forum.
@Cedric When using the theme "Navy Blue", it automatically switch's from light mode to dark mode whenever I move from one page to another on the forum now that I've added the affiliates code to my forum. Is that messing with the theme at all?

Do you still have this issue? I just checked your forum, but that is not happening for me - both the affiliate box and the light/dark mode switch seem to work just fine.

· 7 months ago

I’m wondering the same as Mace. There is nothing in the code that could conflict. But do let us know if you have further issues.

OP · 7 months ago

@Mason @Cedric

Yes, it is still doing it.

· 7 months ago

Cat_Lady said:
@Mason @Cedric

Yes, it is still doing it.

That'd odd. Have you tried clearing your browser cache?

I just tried again in the browser that you are using specifically, but everything still seems to work just fine.

Create a free account to join the conversation.
Sign up free