Skip to content

Instantly share code, notes, and snippets.

View wpacademy's full-sized avatar

Mian Shahzad Raza wpacademy

87 followers · 1 following
View GitHub Profile
@wpacademy
wpacademy / mask.css
Created October 4, 2024 01:04
CSS code for SVG Mask to Apply on a Section or Container
selector {
aspect-ratio: 1200 / 600;
background-color: tomato;
mask-image: url("/* SVG URL */");
-webkit-mask-image: url("/* SVG URL also here */");
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: 100% auto;
-webkit-mask-size: 100% auto;
/* mask-size: contain; */
@wpacademy
wpacademy / code.js
Last active August 17, 2024 08:27
Hide the language label for GTranslate plugin when using Popup mode via shortcode in your template.
/**
* This is a jQuery code snippet
*/
jQuery(document).ready(function($) {
$("a.glink span").first().html("");
});
@wpacademy
wpacademy / animated-text.css
Last active June 13, 2024 19:48
Animated Gradient Text effect in CSS
h1 {
background: linear-gradient(
to right,
#CC98FF 20%,
#00affa 30%,
#0190cd 70%,
#FC96FF 80%
);
-webkit-background-clip: text;
background-clip: text;
@wpacademy
wpacademy / css.txt
Created August 3, 2023 07:43
CSS code for login & signup page design tutorial on WPAcademy
/**
* CSS styles for Ultimate Member plugin used in the Login/Signup page design tutorial.
*/
.wpac-login-form .um-form {
text-align: center;
}
.wpac-login-form .um-login {
margin-bottom: 0 !important;
}
.wpac-login-form .um-misc-with-img {
@wpacademy
wpacademy / style.css
Created May 25, 2023 01:47
CSS code used in the Modern Carousel Design Tutorial on WP Academy YouTube channel.
/*
* Loop Item
*/
.member-info {
visibility: hidden;
}
selector {
transition: .6s all;
}
selector:hover .member-info {
@wpacademy
wpacademy / style.css
Created April 29, 2023 03:24
Elementor Dynamic Reviews Tutorial CSS
selector .elementor-swiper-button-prev {
top: -10px;
right: 60px;
left: auto;
}
selector .elementor-swiper-button-next {
top: -10px;
right:0px;
left: auto;
}
@wpacademy
wpacademy / style.css
Created October 15, 2022 20:19
CSS code for the SaaS website design tutorial by WP Academy
/***********************************
* For: SaaS Website Design Tutorial
* By: WPAcademy.PK
* Info: Please use appropirate class names into the sections or widget.
You can change the names, just make sure you are uaing correct class name
in the section or widget after changing the names.
**********************************/
.elementor-text-editor p {
margin-bottom: 0 !important;
}
@wpacademy
wpacademy / order-tracking.php
Created September 22, 2022 04:26
Order Tracking Page Code for Advanced eCommerce website tutorial by WP Academy
function wpac_add_query_vars_filter( $vars ){
$vars[] = "order_id";
return $vars;
}
add_filter( 'query_vars', 'wpac_add_query_vars_filter' );
function wpac_order_status() {
if(is_page(1141)){
$id = get_query_var('order_id');
$id = intval($id);
@wpacademy
wpacademy / javascript.js
Created August 16, 2022 22:49
JavaScript code for advanced ecommerce website tutorial by WP Academy.
/*
* Description: JavaScript code for advanced ecommerce website tutorial by WP Academy.
* Author: WP Academy
* Author URL: https://wpacademy.pk
* Usage Info:
Use appropirate jQuery code inside an HTML widget (Elementor) in appropirate sections/templates.
Don't forget to wrap your code inside '<script>YOUR CODE</script>' tags.
*/
// Desktop Header Mega Menu Toggle.
@wpacademy
wpacademy / styles.css
Created August 16, 2022 22:48
CSS code for advanced ecommerce website tutorial by WP Academy
/******************************
* Description: CSS code for advanced ecommerce website tutorial by WP Academy.
* Author: WP Academy
* Author URL: https://wpacademy.pk
* Usage Info:
Please use apporopirate class names in sections or widgets as explained in the video tutorail.
Don't forget to replace color variable names such as '--e-global-color-primary' with your own colors
or global color names.
******************************/