Adam Chiaravalle
Web 
Solutions

Sometimes you just say wat do, ya know?

This is where I save some code snippets.

Check Cloudflare Status for a Domain


curl -sI https://domain.com | grep "cf-cache-status"
			

A really pretty shadow


box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
			

A custom logo carousel - HTML + CSS + JS


<style>
	.custom-carousel {
		overflow: hidden;
		white-space: nowrap; /* Prevents wrapping of inline or inline-block elements */
	}
	
	.custom-carousel-track {
		display: flex;
		padding: 0;
		list-style-type: none;
	}
	
	.custom-carousel-slide {
		margin-right: 75px; /* Adjust based on your desired space between logos */
		flex: 0 0 auto; /* Prevents flex items from growing or shrinking */
	}
	
	.custom-carousel img {
		display: block;
		width: 150px; /* Fixed width for logos */
		height: 30px!important; /* Maintain aspect ratio */
		object-fit: contain!important;
		vertical-align: middle;
	}
</style>
					
<div id="customCarousel" class="custom-carousel">
  <div class="custom-carousel-track-container">
	<ul class="custom-carousel-track">
	  <!-- First set of logos -->
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo1.png" class="img-fluid  logo"></li>
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo2.png" class="img-fluid  logo"></li>
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo3.png" class="img-fluid  logo"></li>
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo4.png" class="img-fluid  logo"></li>
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo5.png" class="img-fluid  logo"></li>
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo6.png" class="img-fluid  logo"></li>

	  <!-- Duplicate the sequence for a seamless transition -->
	  <li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo1.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo2.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo3.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo4.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo5.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo6.png" class="img-fluid  logo"></li>

		
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo1.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo2.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo3.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo4.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo5.png" class="img-fluid  logo"></li>
		<li class="custom-carousel-slide"><img src="/wp-content/themes/acwebdev/assets/logo6.png" class="img-fluid  logo"></li>

	</ul>
  </div>
</div>
					
<script>
	const track = document.querySelector('.custom-carousel-track');
	const slides = Array.from(track.children);
	const singleSetWidth = slides[0].getBoundingClientRect().width * (slides.length / 2); // Width of a single set of logos
	
	let moveAmount = 0;
	const moveCarousel = () => {
	  moveAmount -= 1; // Adjust the speed of the movement
	  if (Math.abs(moveAmount) > singleSetWidth) {
		moveAmount = 0;
	  }
	  track.style.transform = 'translateX(' + moveAmount + 'px)';
	};
	
	// Move the carousel every 20ms
	setInterval(moveCarousel, 30);

</script>
			

Clarity - an amazing free alternative to Hotjar with recordings, heatmaps, GA4 integration


https://clarity.microsoft.com/
			

Monthly Wordpress Maintenance Checklist

Note that this is different from a site improvement plan, this is to be used ideally when the site is already performing well


# Monthly WordPress Maintenance Checklist

## 1. WordPress Core, Theme, and Plugin Updates
- [ ] **Update WordPress Core:** Check for and apply the latest WordPress updates.
- [ ] **Update Themes:** Ensure all themes are updated to their latest versions.
- [ ] **Update Plugins:** Update all plugins to their most recent versions to ensure compatibility and security.

## 2. Backups
- [ ] **Perform a Full Backup:** Create a complete backup of your website, including the database and all files.
- [ ] **Verify Backup Integrity:** Test the backup to ensure it's complete and can be restored.
- [ ] **Store Backups Off-Site:** Keep backup copies in an off-site location or cloud storage for added security.

## 3. Security Checks
- [ ] **Run Security Scans:** Use a security plugin or service to check for malware, vulnerabilities, or unauthorized changes.
- [ ] **Review User Accounts:** Audit user accounts and permissions, removing inactive users and adjusting roles as necessary.
- [ ] **Check for Broken Links:** Use a tool to identify and fix any broken links on your site.
- [ ] **Run WPScan and fix any vulnerabilities**

## 4. Performance and Optimization
- [ ] **Optimize Database:** Clean up and optimize the WordPress database to improve performance.
- [ ] **Check Page Speed:** Use tools like Google PageSpeed Insights to analyze and improve page load times.
- [ ] **Review Web Hosting Performance:** Ensure your hosting plan still meets your site's needs and consider upgrades if necessary.

## 5. SEO and Analytics
- [ ] **Review SEO Rankings:** Check your website's SEO rankings and identify areas for improvement.
- [ ] **Analyze Traffic:** Use Google Analytics or another analytics tool to review your site's traffic and user behavior.
- [ ] **Update Sitemaps:** If necessary, regenerate and submit your sitemap to search engines.

## 6. Content Review and Management
- [ ] **Audit Content:** Review and update existing content for relevance, accuracy, and SEO optimization.
- [ ] **Check for 404 Errors:** Identify and redirect any 404 error pages to relevant content.
- [ ] **Plan Future Content:** Develop a content strategy for the upcoming month.
- [ ] **Scan for broken links using Integrity**

## 7. Website Functionality
- [ ] **Test Forms and CTAs:** Ensure that all forms and call-to-action buttons are functioning correctly.
- [ ] **Review Cross-Browser Compatibility:** Check your website's appearance and functionality across different browsers.
- [ ] **Mobile Responsiveness:** Verify that your site is fully responsive and looks good on various mobile devices.

## 8. Legal Compliance
- [ ] **Review Privacy Policy:** Ensure your privacy policy is up-to-date and compliant with laws like GDPR or CCPA.
- [ ] **Check for Copyright Compliance:** Ensure all content, images, and other media are correctly licensed or attributed.

Remember to document all changes and updates made during your monthly maintenance. Regular maintenance is crucial for the security, performance, and longevity of your WordPress site.
			

View site on all responsive screen sizes, also grab full-length screenshots


responsively.app