Karma Observation

Observational Post: Starting of Lord Rahu( North Node) dasha or Preiod

Karma Observation

As an enthusiast of Vedic Astrology, If your Lord Rahu Dasha (North Node) is going to start, or, If you are already running Lord Rahu ( North Node) dasha, then please observe the following and take measures as per the followings

Continue reading “Observational Post: Starting of Lord Rahu( North Node) dasha or Preiod” →
Karma Observation

Observational Post: Starting of Lord Ketu ( South Node) dasha or Preiod

Karma Observation

As an enthusiast of Vedic Astrology, If your Lord Ketu Dasha (South Node) is going to start, or, If you are already running Lord Ketu ( South Node) dasha, then please observe the following and take measures as per the followings

Continue reading “Observational Post: Starting of Lord Ketu ( South Node) dasha or Preiod” →
Web Development

Show Facebook, Twitter, Instagram, Linkedin, Pinterest, Youtube and more social icon using Fontawesome

allaboutbasic 

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/all.css" />

<style>
.social-icons a {
    text-decoration: none;
    color: orange;
    margin-right: 12px;
    padding: 0px;
    font-size: 27px;
}
</style>

	<div class="social-icons">
  <div class="social-icons__icons">
    

  <a class="slink" href="Your Twitter URL">
    <i class="fab fa-twitter"></i>
  </a>


  <a class="slink"  href="Your Instagram URL">
    <i class="fab fa-instagram"></i>
  </a>

  <a class="slink"  href="Your linkedin URL">
    <i class="fab fa-linkedin-in"></i>
  </a>

  <a class="slink"  href="Your Pinterest URL">
    <i class="fab fa-pinterest"></i>
  </a>


  <a class="slink"  href="Your Youtube URL">
    <i class="fab fa-youtube"></i>
  </a>
  
  
    <a class="slink"  href="Your Facebook URL">
    <i class="fab fa-facebook"></i>
  </a>


</div>
</div>

This Fontawesome file supports this social icons

Using the html code above and using the class below you can use those social icons. If you face any issue please feel free to let me know in comments section

  • fab fa-facebook-f: Facebook
  • fab fa-twitter: Twitter
  • fab fa-instagram: Instagram
  • fab fa-linkedin-in: LinkedIn
  • fab fa-youtube: YouTube
  • fab fa-pinterest-p: Pinterest
  • fab fa-snapchat-ghost: Snapchat
  • fab fa-tumblr: Tumblr
  • fab fa-reddit: Reddit
  • fab fa-whatsapp: WhatsApp
  • fab fa-telegram: Telegram
  • fab fa-skype: Skype
  • fab fa-discord: Discord
  • fab fa-tiktok: TikTok
  • fab fa-500px: 500px
  • fab fa-accessible-icon: Accessible Icon
  • fab fa-accusoft: Accusoft
  • fab fa-acquisitions-incorporated: Acquisitions Incorporated
  • fab fa-adn: App.net
  • fab fa-adobe: Adobe
  • fab fa-adversal: Adversal
  • fab fa-affiliatetheme: affiliatetheme
  • fab fa-airbnb: Airbnb
  • fab fa-algolia: Algolia
  • fab fa-alipay: Alipay
  • fab fa-amazon: Amazon
  • fab fa-amazon-pay: Amazon Pay
  • fab fa-amilia: Amilia
  • fab fa-android: Android
  • fab fa-angellist: AngelList
  • fab fa-angrycreative: Angry Creative
  • fab fa-angular: Angular
  • fab fa-app-store: App Store
  • fab fa-app-store-ios: App Store iOS
  • fab fa-apper: Apper Systems AB
  • fab fa-apple: Apple
  • fab fa-apple-pay: Apple Pay
  • fab fa-artstation: ArtStation
  • fab fa-asymmetrik: Asymmetrik, Ltd.
  • fab fa-atlassian: Atlassian
  • fab fa-audible: Audible
  • fab fa-autoprefixer: Autoprefixer
  • fab fa-avianex: Avianex
  • fab fa-aviato: Aviato
  • fab fa-aws: Amazon Web Services (AWS)
  • fab fa-bandcamp: Bandcamp
  • fab fa-battle-net: Battle.net
  • fab fa-behance: Behance
  • fab fa-behance-square: Behance Square
  • fab fa-bitbucket: Bitbucket
  • fab fa-bitcoin: Bitcoin
  • fab fa-bity: Bity
  • fab fa-black-tie: Black Tie
  • fab fa-blackberry: BlackBerry
  • fab fa-blogger: Blogger
  • fab fa-blogger-b: Blogger B
  • fab fa-blender: Blender
  • fab fa-bluetooth: Bluetooth
  • fab fa-bluetooth-b: Bluetooth
  • fab fa-bootstrap: Bootstrap
  • fab fa-btc: Bitcoin
  • fab fa-buffer: Buffer
  • fab fa-buromobelexperte: Büromöbel-Experte GmbH & Co. KG.
  • fab fa-buy-n-large: Buy n Large
  • fab fa-buysellads: BuySellAds
  • fab fa-canadian-maple-leaf: Canadian Maple Leaf
  • fab fa-cc-amazon-pay: Amazon Pay Credit Card
  • fab fa-cc-amex: American Express Credit Card
  • fab fa-cc-apple-pay: Apple Pay Credit Card
  • fab fa-cc-diners-club: Diners Club Credit Card
  • fab fa-cc-discover: Discover Credit Card
  • fab fa-cc-jcb: JCB Credit Card
  • fab fa-cc-mastercard: MasterCard Credit Card
  • fab fa-cc-paypal: PayPal Credit Card
  • fab fa-cc-stripe: Stripe Credit Card
  • fab fa-cc-visa: Visa Credit Card
  • fab fa-centercode: Centercode
  • fab fa-centos: CentOS
  • fab fa-chrome: Chrome
  • fab fa-chromecast: Chromecast
  • fab fa-cloudflare: Cloudflare
  • fab fa-cloudscale: Cloudscale.ch
  • fab fa-cloudsmith: Cloudsmith
  • fab fa-cloudversify: cloud
WordPress Tricks

How to redirect Author Page URL to Different Page

allaboutbasic
Change Author Link or Redirect Author URL to different page

Sometimes you may need to change default author url to different page. Here I am sharing you the code which you can use without modifying the theme file.


function modify_author_posts_url( $author_posts_url, $author_id ) {
  // modify the URL here
  $author_posts_url = 'https://www.example.com/';
  return $author_posts_url;
}
add_filter( 'author_link', 'modify_author_posts_url', 10, 2 );

You can use Code Snippet plugins to use the code, here is the screenshot about how you can use the code.

Change Author Link or Redirect Author URL to different page using Code Snippet
WordPress Tricks

Free Yoga based WordPress Site: Modification of Header, footer, menu, sidebar, author, category and more.

allaboutbasic

If you are a Yoga instructor and trying to create your website, here is your solution. Here I have shown in a video (4minutes) how you can create your initial Yoga Teaching site for free and how u can set up the site. Also I have shared css codes to modify it

You can see Demo here.

Here is the OceanWP TheAme.

Continue reading “Free Yoga based WordPress Site: Modification of Header, footer, menu, sidebar, author, category and more.” →
Web Development

Simple Timezone carousel with next and previous button to show different times of countries, using jQuery, php and css: WordPress or php based sites

allaboutbasic

Here is a simple timezone carousel to show time of different countries in carousel format. You can use Next and Previous button to show Next 4 countries time. I have shared you the corresponding php, html and css code. If you face any issue, feel free to comments. 


<div id="time-carousel" class="time-carousel">
  <?php 
    $timezone_identifiers = DateTimeZone::listIdentifiers(DateTimeZone::AMERICA | DateTimeZone::EUROPE);
    foreach($timezone_identifiers as $timezone) {
        $date = new DateTime('now', new DateTimeZone($timezone));
        echo '<div class="time-carousel-item">';
        echo '<h3>'.$timezone.'</h3>';
        echo '<p>' . $date->format('H:i') . '</p>';
        echo '</div>';
    }
  ?>
</div>
<a href="#" id="prev">Previous</a>
<a href="#" id="next">Next</a>

<script>
jQuery(document).ready(function(){
    var slideIndex = 0;
    showSlides();

    function showSlides() {
        var i;
        var slides = jQuery(".time-carousel-item");
        for (i = 0; i < slides.length; i++) {
            if(i < slideIndex || i >= slideIndex + 4) {
                slides.eq(i).hide();  
            } else {
                slides.eq(i).show();
            }
        }
    }

   jQuery("#prev").click(function(event){
    event.preventDefault();
    var slides = jQuery(".time-carousel-item");
    slideIndex = Math.max(0, slideIndex - 4);
    showSlides();
});

jQuery("#next").click(function(event){
    event.preventDefault();
    var slides = jQuery(".time-carousel-item");
    slideIndex = Math.min(slides.length - 4, slideIndex + 4);
    showSlides();
});
});
</script>
<style>
	.time-carousel {
  display: flex;
  flex-wrap: wrap;
}
.time-carousel {
    display: flex;
    flex-wrap: wrap;
}
.time-carousel-item {
    width: 25%;
    padding: 10px;
    text-align: center;
}
	.time-carousel-item h3 {
    font-size: 18px;
    font-weight: bold !IMPORTANT;
}
</style>
WordPress Tricks

In elementor font family is used var( –e-global-typography-primary-font-family ) how to change this font?

allaboutbasic

To change the font family in Elementor, you can do the following:

  1. Go to the Elementor editor for the page or template where you want to change the font family.
  2. Click on the hamburger menu icon in the top left corner to open the Global Settings.
  3. Go to the Typography tab.
  4. Under the Primary Font section, you will see the option to change the font family.
  5. You can either choose a font from the dropdown menu or enter the name of a custom font you want to use.
  6. Click on the Save button and the new font family will be applied to all elements on your page that use the primary font.