LaurenZA

This worked great!! Thank you!!
This is a business plan site, so I would be interested in the JavaScript option if you don't mind sharing. 

As this is an old Wells template, the selector is different, so it would be something like this:
.logo.site-title a { pointer-events: none; } If you want to redirect it, the site will need to be on a Business Plan or above as you'll need to use JavaScript for this.
Did this help? Please give feedback by clicking an icon below  ⬇️

Thank you so much for this @Ziggy!! Worked great.
For anyone else, it showed like this at first: 
 
 
So I played around with the code and got it to look like this: 


 
The code I ended up using was: 
@media only screen and (min-width:767px) {
section[data-section-id="64d40640bd49c26b55b6760e"] {
.user-items-list-simple .list-item {
display: flex; flex-direction: row;
}
.list-item-media {
width:30% !important; margin-left: 0px !important;
}

.list-item-content {
width:65% !important;
}
}
}

Thank you so much for this @Ziggy!! Worked great.
For anyone else, it showed like this at first: 
 
 
So I played around with the code and got it to look like this: 


 
The code I ended up using was: 
@media only screen and (min-width:767px) {
section[data-section-id="64d40640bd49c26b55b6760e"] {
.user-items-list-simple .list-item {
display: flex; flex-direction: row;
}
.list-item-media {
width:30% !important; margin-left: 0px !important;
}

.list-item-content {
width:65% !important;
}
}
}

You can try this Custom CSS:
@media only screen and (min-width:767px) { section[data-section-id="64d40640bd49c26b55b6760e"] { .user-items-list-simple .list-item { display: flex; flex-direction: row; } .list-item-content, .list-item-media { width:50% !important; } } }

First thing to know is that a CSS solution (or a client-side JS solution for that matter) can only affect elements that have already been loaded up. that means that you can only reverse the order of the first n posts which squarespace. (n is set in the blog page settings and can go up to a max of 20).
if you're ok with that, then it's actually pretty easy. just make sure that the blog container you're using is set to flex and then reverse the flex direction.
so in your case - as you're using side-by-side - just add this to your css.
.blog-side-by-side-wrapper { display:flex; flex-direction:column-reverse; } remember though, if your page is set to show n articles and you add n+1 articles to your blog then you won't get the oldest post. you'll get the oldest post of the first n newest posts.... your pagination would also be a bit weird.
PS. the first computer we ever had in our house was a TRS-80!
 
ADDENDUM: Pagination on item pages
I looked at your post and you want to swap the pagination links as well. A little trickier, as the next and previous are aligned and padded in specific ways with arrow icons. But you can do it. 
reverse the flex direction invert the padding flip the icons 100% horizontal prefix the css rules with this particular blog collection-id as you don't want to change other pagination in the site  
body.collection-642f14ee1e413265ff0d44f2 section#itemPagination { flex-direction: row-reverse; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link.item-pagination-link--next { margin-left: 0; margin-right: auto; flex-direction: row-reverse; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link.item-pagination-link--prev { margin-right: 0; margin-left: auto; flex-direction: row-reverse; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link.item-pagination-link--next .item-pagination-icon { padding-left: 0px; padding-right: 25px; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link.item-pagination-link--prev .item-pagination-icon { padding-right: 0px; padding-left: 25px; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link.item-pagination-link--prev { margin-right: 0; margin-left: auto; flex-direction: row-reverse; } body.collection-642f14ee1e413265ff0d44f2 a.item-pagination-link svg { transform: scaleX(-100%); }  

Some CSS Class/ID for Squarespace 7.1
Announcement Bar
Announcement bar: .sqs-announcement-bar-dropzone Announcement bar text: .sqs-announcement-bar-dropzone p Announcement bar link: .sqs-announcement-bar-dropzone a Announcement Bar Close Icon: .sqs-announcement-bar-close OR .sqs-announcement-bar-close:after Header
Header: header#header Sticky Header: header.shrink Header (not include sticky header): header#header:not(.shrink) Header (when burger menu is open): body.header--menu-open header#header Header (when burger menu is close): body:not(.header--menu-open) header#header Site Title: a#site-title Site Title (when overlay menu open): .header--menu-open a#site-title Site Title (when overlay menu close) body:not(.header--menu-open) a#site-title Navigation: .header-nav Navigation Items: .header-nav-item a Navigation First Item: .header-nav-item:nth-child(1) a Navigation Second Item: .header-nav-item:nth-child(2) a Navigation Dropdown: .header-nav-folder-content Navigation Dropdown Items: .header-nav-folder-item a Navigation Folder Title: a.header-nav-folder-title Mobile Navigation Items: .header-menu-nav-item a Mobile Navigation First Item: .header-menu-nav-folder[data-folder="root"]>div>div:first-child Mobile Navigation First Item (text): .header-menu-nav-folder[data-folder="root"]>div>div:first-child a Mobile Navigation Second Item: .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(2) Mobile Navigation Second Item (text): .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(2) a Mobile Menu Icon: .header-burger Mobile Burger 3 lines: .burger-inner>div Mobile Menu X icon: body.header--menu-open .burger-inner>div Header Social Icons: .header-actions .icon Cart Icon: header#header span.Cart-inner Cart quantity: header#header .icon-cart-quantity Header Button: header#header a.btn Header Desktop Button: .header-display-desktop a.btn Header Mobile Button: .header-menu-cta a a Footer
Footer: footer#footer-sections Footer Social Icons:  footer#footer-sections  .sqs-svg-icon–outer Footer Links: footer#footer-sections a Product List
Product List: .collection-type-products.view-list Product Name: .grid-title Product Price: .grid-prices Product Image: figure.grid-image Product Currency: body.native-currency-code-usd .sqs-money-native:before Sold Out Text: .product-mark.sold-out Product Detail
Product Detail: .collection-type-products.view-item Product Breadcrumb: .ProductItem-nav-breadcrumb Product Pagination (Previous/Next): .ProductItem-nav-pagination Gallery: figure.ProductItem-gallery Thumbnails: .ProductItem-gallery-thumbnails Big Image: .ProductItem-gallery-slides Product Name: h1.ProductItem-details-title Price: .ProductItem-product-price Currency: body.native-currency-code-usd .sqs-money-native:before Excerpt: .ProductItem-details-excerpt Add to Cart Button: .sqs-add-to-cart-button-wrapper Add to Cart Text: .sqs-add-to-cart-button-inner Variant Dropdown: .variant-option Variant Title: .variant-option-title Variant Options: .variant-select-wrapper option Quantity Text: .quantity-label Quantity Input: .product-quantity-input Cart Page
Cart Page: body#cart Cart Page Title: .cart-title Product Name: a.cart-row-title Product Thumbnail: div.cart-row-img Qty minus: .cart-row-qty-dec Qty plus: button.cart-row-qty-inc Qty number: input.cart-row-qty-input Price: .cart-row-price X icon: .cart-row-remove or .cart-row-remove svg Sub total text: .cart-subtotal-label span Sub total price: .cart-subtotal-price Checkout Button: button.cart-checkout-button   Item: .CartTable-itemLabel-3zzV1 QTY. .CartTable-itemLabel-3zzV1 span Price Name: .CartTable-itemPrice-XgjsO span X icon: .item-remove div Blog List
Blog List: [class*="type-blog"].view-list Thumbnails: article.blog-item img Date: time.blog-date Category: span.blog-categories-list Title: h1.blog-title Excerpt: .blog-excerpt Read more: a.blog-more-link Blog Posts
Blog Posts Page: [class*="type-blog"].view-item Blog Items: .blog-item-entry Categories: .blog-meta-item–categories Date: time.dt-published.blog-meta-item.blog-meta-item–date Author: .blog-meta-item.blog-meta-item–author.p-author.author Title: .blog-item-title Content: .blog-item-content-wrapper Pagination: .item-pagination Pagination Arrows: .item-pagination-link .item-pagination-icon Pagination Title: h2.item-pagination-title Author Box: .blog-item-author-profile-wrapper Author Image: a.author-avatar.content-fill Author Name: .author-name Author Site: a.author-website Post Comment: .squarespace-comments Post Comment Button: .comment.btn Comment Input: .squarespace-comments .new-comment-area Preview: span.btn-text.preview-comment.top-level-preview-btn Subscribe via email text: span.subscribe.subscribe-control Blog Grid
updating
Blog Masonry
updating
Event List Page
Event List Page: .collection-type-events.view-list Event Thumbnail: a.eventlist-column-thumbnail.content-fill Event Time: .eventlist-datetag Event Date: .eventlist-datetag-startdate.eventlist-datetag-startdate–day Event Month: .eventlist-datetag-startdate.eventlist-datetag-startdate–month Event Title: h1.eventlist-title Event Hour: li.eventlist-meta-item.eventlist-meta-time.event-meta-item Event Description: .eventlist-description Event Detail Page
Event Detail Page: .collection-type-events.view-item Event Title: h1.eventitem-title Event Date: time.event-date Event Hour: li.eventitem-meta-item.eventitem-meta-time.event-meta-item Event Description: .eventitem-column-content Event Pagination: section.item-pagination.item-pagination–prev-next Previous/Next: .item-pagination-link .item-pagination-prev-next Event Pagination Title: h2.item-pagination-title Portfolio
title: h3.portfolio-title item: .portfolio-grid-basic portfolio image: .portfolio-grid-basic .grid-image pagination: [data-collection-type=“portfolio-grid-basic”].item-pagination pagination text: h2.item-pagination-title pre text: .item-pagination-link–prev .item-pagination-prev-next next text: .item-pagination-link–next .item-pagination-prev-next List Simple
List Simple: .user-items-list-simple Image: .user-items-list-simple img First Item: .user-items-list-simple li:nth-child(1) Second Item: .user-items-list-simple li:nth-child(2) List Content: .user-items-list-simple .list-item-content Title: .user-items-list-simple h2.list-item-content__title Description:  .user-items-list-simple list-item-content__description OR .user-items-list-simple p List Slideshow
List Slideshow: .user-items-list-banner-slideshow Image: .user-items-list-banner-slideshow img First Item: .user-items-list-banner-slideshow li:nth-child(1) Second Item: .user-items-list-banner-slideshow li:nth-child(2) List Content: .user-items-list-banner-slideshow .slide-content Title: .user-items-list-banner-slideshow h2.list-item-content__title Description:  .user-items-list-banner-slideshow list-item-content__description OR .user-items-list-banner-slideshow p Arrow Circles: .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button Arrow Icons: .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button svg Button: .user-items-list-banner-slideshow .list-item-content__button List Carousel
List Carousel: .user-items-list-carousel__slides Image: .user-items-list-carousel__slides img First Item: .user-items-list-carousel__slides li:nth-child(1) Second Item: .user-items-list-carousel__slides li:nth-child(2) List Content: .user-items-list-carousel__slides .list-item-content Title: .user-items-list-carousel__slides h2.list-item-content__title Description:  .user-items-list-carousel__slides list-item-content__description OR .user-items-list-carousel__slides p Arrow Circles: .user-items-list-carousel__arrow-button Arrow Icons: .user-items-list-carousel__arrow-button svg Button: .user-items-list-carousel__slides .list-item-content__button Fluid Engine
Fluid Block (text block, image...): Each block is wrapped by the same class name .fe-block and a unique id. And All .fe-blocks will be wrapped by a parent tag with a class name of .fluid-engine
 
Checked & Wrote by tuanphan

Hello! 
Here is the link: https://johnaskewhomes.squarespace.com/test-home-blog
password: testing
We are hoping to do the following:
Have four dropdown lists: Neighborhood City Interior Exterior Under each dropdown list will be a list of tags associated with that dropdown name We will add the right tags to the blogs used so when they select a specifc tag in the dropdown the blogs with this tag will show up Can you help with this?

Add the following to Design > Custom CSS.
#block-yui_3_17_2_1_1609164101016_6399 .summary-title-link:hover { background-color: red; padding: 10px; } You can adjust the color and padding to suit.
Let us know how it goes.