pifvouchers

Advice please…

Thanks James,

I want to use wordpress to design both sites. but one will be on SG and one on Kualo.

thanks. how do i setup multisite?

Hope this makes more sense,

When viewing my website on a mobile I have an image in the heading as well as some social media icons, from a plugin. The image is too close to the top of the screen so the icons are overlapping it. I want to move the image down. How do I do this with css?

On a laptop it’s fine as the screen is bigger.

how do i do that?

Thanks. i got lost at number 6. I want to put the donate button onto the menu. how do i do that?

Thanks.

Also, how do I make it one sizze on the sidebar, and bigger on another page? Ways to help the scheme – The Pay it Forward Voucher Scheme (pifgiftvouchers.org)

Thanks.
It should be something like this. Check here. The logo in your first example is the logo in question. It is linked to https://www.pifgiftvouchers.org. If you go to the website it’s the main logo on every page at the top.

Thanks

extension://mbniclmhobmnbdlbpiphghaielnnpgdp/screenshot.html?id=screenshot_0.648413662046857

umm, how do I add a screenshot. Sorry if I’m being a bit thick or slow.

Thanks.

thanks.

How do I move the logo down on the mobile screen?
I want to put a close button on the blue bar please.

https://www.pifgiftvouchers.org/wp-admin/customize.php?url=https%3A%2F%2Fwww.pifgiftvouchers.org%2F

HTML:
<p> <div class=”alertbar”>LATEST NEWS FOR BUSINESSES & ORGANISATIONS: Tracking system is now live. Please register and log all vouchers received to date.</div>
<div class=”yourbox”> <p>
X
</div>

CSS coding:

@media only screen and (max-width:767px) {
   .home .entry-content ul {
       padding: 0;
       margin: 0;
   } 
    .home .site-content .site-main .page {
       padding: 10px;
   }
   .home .site-content .container {
       width: 80%;
   }
}

.alertbar { 
    background-color: #00ffff; 
    color: #00000; 
    display: block; 
    line-height: 25px;
    height: 50px; 
    position: relative; 
    text-align: center; 
    text-decoration: none; 
    top: 0px; 
    width: 100%;
    z-index: 100;
}

.yourbox{
height:100px;
width:400px;
background-color: red;
}

@media only screen and (max-width:767px) {
   .home .entry-content ul {
       padding: 0;
       margin: 0;
   } 
    .home .site-content .site-main .page {
       padding: 10px;
   }
   .home .site-content .container {
       width: 80%;
  }

	{
  border: 1px solid #ddd;
  margin-top: -1px; /* Prevent double borders */
  background-color: #f6f6f6;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  color: black;
  display: block;
  position: relative;
}

	.close {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 0%;
  padding: 12px 16px;
  transform: translate(0%, -50%);
}

Please help.
I’ve added a notification bar to the site, but in mobile view it’s too big. I’ve using android.
How do I change the size of the bar and move the chat icon from the left to the right on mobile, can I?

Thanks