דיונים - תכנות לוורדפרס |

שרשור סניפטים שימושיים לבניית אתרים | מחפשת איך לשדרג את האתר שלך? מוזמנת 😊

תכנות לוורדפרס

שרשור סניפטים שימושיים לבניית אתרים | מחפשת איך לשדרג את האתר שלך? מוזמנת 😊

פורסם ע"י אפרת דיין הייטק on 23/10/2022 ב2:35 pm
שלום לכוולן 😀

קרה לכן שחיפשתן משהו מגניב לשדרג איתו את האתר אבל לא מצאתן מה?

או שלא היה לכן את הזמן “לחפור” בגוגל ולדלות משם קוד קליל שבטוח יעבוד?

בדיוק בשביל זה נועד השרשור:)

שרשור לסניפטים שימושיים בבנית אתרים, מקודי CSS פשוטים ועד JSים מורכבים וכו.

חשוב שאלו יהיו קודים קצרים, מתומצתים שבטוח עובדים ואולי שאפילו השתמשתן בהם פעם.

בכל הקודים שייכתבו – יש למצוא את נתוני העיצוב ולשחק איתם על פי הדרישות של כל אתר.

אם רוצים שיתבצע על כל האתר – לשים בCSS בהתאמה אישית הכללית.

אם לווידג’ט מסויים – ב-CSS מותאם של אותו ווידג’ט.

(שמנה לב שיש כאן למטה אפשרות הפיכת טקסט רגיל לחלוניות קוד (בלחיצה על הAa) , כמו ששמתי למטה)

אני אתחיל:

קוד לעיצוב סקרול בר
```
/* width */
::-webkit-scrollbar {
  width: 7px;
}
/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: #98DED9; 
  border-radius: 10px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b30000; 
}
```
קוד להחלפת הצבע לבחירה כלשהי (כשתופסים עם העכבר את המילים)
```
::selection {  
	color: #000000;
	background-color: red;
}
/* for firefox */
::moz-selection {
	color: #000000;
	background-color: red;
}
```
קוד להטמעת לוגו מונפש בטעינת דף (יש לשים בווידג’ט HTML בעמוד שבו רוצים שהטעינה תקרה)
```
<div class="loader" ></div>
<script>
window.onload = function() {
jQuery(function($){
$('.loader').fadeOut('slow');
});
};
/*document.addEventListener('DOMContentLoaded', function() {
jQuery(function($){
$('.loader').fadeOut('slow');
}); });*/
</script>
<style>
.loader {
position: fixed;
animation-duration: 500ml;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url('https://touchdesign.co.il/wp-content/uploads/2020/10/לוגו-לטעינת-אתר.gif') 50% 50% no-repeat #fff; /* Change the #fff here to your background color of choice for the preloader fullscreen section */
}
.elementor-editor-active .loader{
display: none;
}
</style>
```
בהמשך בעז”ה אעלה עוד.

יש מישהי שמכירה נוספים? אשמח שתשרשר לכאן

כותרת עם הסדר קצר ולאחריה הקוד.

בהצלחה!! 😇
חגית קרמר – בניית אתרים ברמה בינלאומית הגיבה לפני 1 שנה, 6 חודשים 2 חברות · 1 תגובה
1 תגובה

חגית קרמר – בניית אתרים ברמה בינלאומית

הייטק

חברה

24/10/2022 ב7:54 pm

@efratD רעיון מקסים 🙂

אנימציה לסחרור וידג’ט תמונה / וידג’ט אייקון וכדומה.
טיפ: הגדירי לוידג’ט רוחב “בתוך השורה” כדי שהאנימציה לא תגלוש מהדף.

selector{
    animation: jumping 5s ease infinite !important;
    line-height: 10px !important;
}
@keyframes jumping{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    20%{
        -webkit-transform: rotate(70deg);
        transform: rotate(70deg);
    }
    40%{
        -webkit-transform: rotate-70deg);
        transform: rotate(-70deg);
    }
    70%{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

התחברי כדי להגיב

תכנות לוורדפרס

מובילה:

שרשור סניפטים שימושיים לבניית אתרים | מחפשת איך לשדרג את האתר שלך? מוזמנת 😊

שרשור סניפטים שימושיים לבניית אתרים | מחפשת איך לשדרג את האתר שלך? מוזמנת 😊

חגית קרמר – בניית אתרים ברמה בינלאומית

מעוניינת בפרסום

ניתן לפנות גם במייל ל: [email protected]

מה את מחפשת?

מילות מפתח פופולריות לפי תחומים

ניתן לחפש גם מילות מפתח , תפקידים וכישרון מיוחד שאינם מופיעים ברשימות - "נהגת", "ציור בחול" וכדומה.