Generatepress Primary Menu Button add कैसे करें ? Easy method

यदि आप generatepress theme user है और Generatepress theme Primary Menu मे बटन लगाना चाहते है तो ये पोस्ट आपके लिए है

आपने बहुत से ब्लॉग पर देखा होगा की Primary menu ( Navigation bar ) मे button ऐड रहता है जो की दिखने मे अट्रैक्टिव तो होता ही है साथ मे किसी Important pages को User के लिए Highlight करना हो तो Primary menu or इसमें बटन ऐड करना सबसे बेहतर तरीका है

लेकिन सवाल यह होता है की बटन ऐड कैसे किया जाए क्योंकि बहुत से वेबसाइट page builder द्वारा डिज़ाइन किया गया होता है ( बहुत से लोग Page builder इस्तेमाल नहीं करना चाहते ) ऐसे मे बटन ऐड करना उन्हें थोड़ा मुश्किल लगता है लेकिन ऐसा बिल्कुल भी नहीं है

यदि आपको थोड़ी बहुत कोडिंग की जानकारी है तो यह काम आसानी से कर सकते है वही यदि कोडिंग की जानकारी नहीं है तो आप इस पोस्ट मे बताए गए तरीके को फॉलो करें i am Sure की आप 100% अपने ब्लॉग ( जिसमे generatepress install है ) उस ब्लॉग के primary navigation मे button ऐड कर सकते है

Read also: Generatepress Homepage design कैसे करें

Generatepress Primary Menu ( Navigation ) मे बटन कैसे ऐड करें ( using generatepress default class )

Generatepress Primary Menu ( Navigation ) मे बटन ऐड करने के लिए नीचे दिए गए Step को फ़ॉलो करें

1. Go to Menu Section – चुकी प्राइमरी मेनू मे बटन ऐड करना है इसलिए सबसे पहले एक Custom button tab create करना है WordPress मे लॉगिन करें Appearance > Menu मे जाए

Primary Menu सेलेक्ट करें > Custom link पर क्लिक करें > Url मे जिस पेज को ऐड करना है उसे डाले और Text मे पेज का नाम डाल दे add to menu पर क्लिक करें

2. Menu मे सबसे लास्ट मे आपके द्वारा क्रिएट किया गया बटन होगा ( custom link ) Arrow पर क्लिक करें और Css Classes box मे nav-button डालकर Save Menu पर क्लिक करें
3. नीचे दिए गए Css Copy करें

@media (min-width:769px) {
    .main-navigation .main-nav ul li.nav-button a {
        background-color: transparent;
        border: 2px solid #fff;
        color: #fff;
        line-height: 35px; /*this number will likely need to be adjusted*/
    }
}

4. appearance > Customise > additional Css मे कही भी कोड peste कर दे और पब्लिश कर दे

Customision; यदि आप थोड़ी बहुत कोडिंग की जानकारी रखते है तो बटन की Height width, background color etc. change कर सकते है

आप देख सकते है की आपके ब्लॉग जिसमे Generatepress theme इस्तेमाल किया गया है उसके primary menu मे button ऐड हो चूका है इस तरह बड़ी ही आसानी से आप प्राइमरी मेनू मे बटन ऐड कर सकते है

Confusion ; मै जानता हूँ की आपको सवाल परेशान कर रहा है वो है बिना Html के कैसे बटन ऐड हो गया ?

क्योकि बटन के लिए by default theme मे कोडिंग किया गया है इसलिए यहाँ Html की जरुरत नहीं पड़ती वही यदि Html का यूज़ करके buttonलगाना चाहते है तो नीचे बताए गए तरीका इस्तेमाल कर सकते है

Read also: Generatepress me Adsense code without plugin kaise add kare 

How to add Button In Primary Menu Using Html and Css

1. नीचे दिए गए Html कोड कॉपी कर ले इसमें Text की जगह Pages name और Url की जगह Page Url डाल ले

<a class="button" href="https://successbranch.com">Button to successbranch</a>

2. appearance > menu > custom link > enter url > and Peste html Code
3. finally add to menu पर क्लिक करें और Save menu पर क्लिक करके मेनू सेव कर दे
4. नीचे दिए गए Css copy करें और appearance > customise > additional css > box मे कही भी Css peste कर दे और Publish करें

.button.gradient,
.button.gradient:visited {
    border-radius: 5px; /*Adjust accordingly*/
    background: rgb(255, 183, 65);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(49%, rgba(255, 183, 65, 1)), to(rgba(214, 38, 38, 1)));
    background: linear-gradient(180deg, rgba(255, 183, 65, 1) 49%, rgba(214, 38, 38, 1) 100%);
    -webkit-transition: all 0.35s ease;
    transition: all 0.35s ease;
    background-repeat: repeat-y;
    background-size: 100% 90px;
    background-position: 0 -30px;
}
.button.gradient:hover,
.button.gradient:active {
    background-position: 0;
}

इस तरह से Generatepress theme मे html and css का इस्तेमाल करके primary menu मे Custom button ऐड कर सकते है

मैंने generatepress primary menu मे बटन ऐड करने के दोनों तरीके बताए है आपको जो आसान लगे आप उसे इस्तेमाल कर सकते है

Generatepress Theme से रिलेटेड हिंदी मे किसी भी प्रकार की जानकारी चाहिए तो आप हमसे कमेंट के माध्यम से पूछ सकते है उम्मीद है आपको हमारा ये पोस्ट पसंद आया

आपको लगे की ये पोस्ट वाकई मे Helpful है तो इसे सोशल साइट्स पर जरूर शेयर करें