મુખ્ય સામગ્રી પર જાઓ

દિવસનું ડિઝાઇન

તમારી વેબસાઈટ પર દિવસનું ડિઝાઇન એમ્બેડ કરો

દિવસનું ડિઝાઇન દરરોજ એક નવી ફીચર પ્રકાશિત કરે છે. ઈમેજનું સરનામું ક્યારેય બદલાતું નથી, પણ તેની પાછળનું ચિત્ર બદલાય છે, તેથી તમે એક વાર કોડ ઉમેરો અને તમારા મુલાકાતીઓ આપોઆપ આજની ફીચર જુએ છે.

આ કેવી રીતે કામ કરે છે

દરરોજ એક નિશ્ચિત સરનામા પર એક નવું ચિત્ર પ્રકાશિત થાય છે. તમારું પેજ તે સરનામું લોડ કરે છે, તેથી તે હંમેશા વર્તમાન ફીચર બતાવે છે, અને ક્લિક કરવાથી તમારા મુલાકાતીઓ દિવસનું ડિઝાઇન પર જાય છે જ્યાં સંપૂર્ણ વાર્તા કહેવામાં આવે છે.

સ્ક્રિપ્ટ પસંદ કરો છો? એક કન્ટેનર અને એક સ્ક્રિપ્ટ ઉમેરો: વિજેટ data-dotd-variant (image, cta અથવા card) વડે તમે પસંદ કરેલી શૈલી દોરે છે, જ્યારે તે ભાષા ઉપલબ્ધ હોય ત્યારે સ્ક્રિપ્ટ સરનામાની ભાષામાં. જો તમે સ્ક્રિપ્ટ ચલાવી શકતા ન હો, તો સમાન વેરિઅન્ટનું HTML સંસ્કરણ વાપરો.

વેરિઅન્ટ A: ફક્ત ઈમેજ

આજનું ચિત્ર, દિવસનું ડિઝાઇન સાથે લિંક કરેલું. સૌથી હલકો વિકલ્પ.

લાઈવ પ્રીવ્યૂ

<a href="https://designoftheday.org/gu/" target="_blank" rel="noopener">
  <img src="https://competition.adesignaward.com/design-of-the-day/today.png" alt="પુરસ્કાર વિજેતા સર્જનાત્મક ઉત્કૃષ્ટતા દર્શાવતું દિવસનું ફીચર્ડ ડિઝાઇન" loading="lazy" style="max-width:100%;height:auto">
</a>
<div data-dotd="designoftheday.org" data-dotd-variant="image"></div>
<script async src="https://designoftheday.org/feature.js?lang=gu"></script>

વેરિઅન્ટ B: ઈમેજ અને કૉલ ટુ એક્શન

આજનું ચિત્ર નીચે કૉલ ટુ એક્શન સાથે.

લાઈવ પ્રીવ્યૂ

<a href="https://designoftheday.org/gu/" target="_blank" rel="noopener" style="display:block;max-width:100%;color:inherit;text-decoration:none;text-align:center">
  <img src="https://competition.adesignaward.com/design-of-the-day/today.png" alt="પુરસ્કાર વિજેતા સર્જનાત્મક ઉત્કૃષ્ટતા દર્શાવતું દિવસનું ફીચર્ડ ડિઝાઇન" loading="lazy" style="display:block;max-width:100%;height:auto;margin:0 auto">
  <span style="display:block;margin-top:.5em;font:600 15px/1.3 system-ui,sans-serif">દિવસનું ડિઝાઇન શોધો</span>
</a>
<div data-dotd="designoftheday.org" data-dotd-variant="cta"></div>
<script async src="https://designoftheday.org/feature.js?lang=gu"></script>

વેરિઅન્ટ C: Bootstrap કાર્ડ

ચિત્ર, ફીચરનું શીર્ષક, એક ટૂંકો ફકરો અને કૉલ ટુ એક્શન બટન સાથેનું Bootstrap કાર્ડ. તમારા પેજને Bootstrap જરૂરી છે.

લાઈવ પ્રીવ્યૂ

<div class="card" style="max-width:24rem">
  <a href="https://designoftheday.org/gu/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-of-the-day/today.png" class="card-img-top" alt="પુરસ્કાર વિજેતા સર્જનાત્મક ઉત્કૃષ્ટતા દર્શાવતું દિવસનું ફીચર્ડ ડિઝાઇન" loading="lazy"></a>
  <div class="card-body">
    <h5 class="card-title">દિવસનું ડિઝાઇન</h5>
    <p class="card-text">A' Design Award દરરોજ એક ઉત્કૃષ્ટ ડિઝાઇન સર્જન, અત્યંત નવીન ઉત્પાદન અથવા અત્યંત સર્જનાત્મક પ્રોજેક્ટને દિવસનું ડિઝાઇન તરીકે પ્રદર્શિત કરે છે, જેમાં સર્જનાત્મકતા અને ઉત્તમ ડિઝાઇનના નોંધપાત્ર ઉદાહરણો રજૂ થાય છે.</p>
    <a href="https://designoftheday.org/gu/" class="btn btn-danger" target="_blank" rel="noopener">દિવસનું ડિઝાઇન શોધો</a>
  </div>
</div>
<div data-dotd="designoftheday.org" data-dotd-variant="card"></div>
<script async src="https://designoftheday.org/feature.js?lang=gu"></script>

વિકલ્પ 3: JSON

ડેવલપર્સ, એપ્સ અને ઓટોમેશન માટે. JSON માં નામ, વર્ણન, ઈમેજ સરનામું, લિંક્સ અને તારીખ સમાવિષ્ટ છે. ક્રોસ-ઓરિજિન વિનંતીઓ માન્ય છે.

fetch("https://designoftheday.org/feature.json?lang=gu")
  .then(function (r) { return r.json(); })
  .then(function (d) {
    // d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
  });

ઉદાહરણ પ્રતિસાદ

{
    "domain": "designoftheday.org",
    "name": "દિવસનું ડિઝાઇન",
    "feature": "દિવસનું ડિઝાઇન",
    "paragraph": "A' Design Award દરરોજ એક ઉત્કૃષ્ટ ડિઝાઇન સર્જન, અત્યંત નવીન ઉત્પાદન અથવા અત્યંત સર્જનાત્મક પ્રોજેક્ટને દિવસનું ડિઝાઇન તરીકે પ્રદર્શિત કરે છે, જેમાં સર્જનાત્મકતા અને ઉત્તમ ડિઝાઇનના નોંધપાત્ર ઉદાહરણો રજૂ થાય છે.",
    "description": "દિવસનું ડિઝાઇન દરરોજ એક ઉત્કૃષ્ટ ડિઝાઇન સર્જન, અત્યંત નવીન ઉત્પાદન અથવા અત્યંત સર્જનાત્મક પ્રોજેક્ટ પ્રદર્શિત કરે છે, જેમાં અત્યંત પ્રતિષ્ઠિત A' Design Award and Competition દ્વારા માન્ય સર્જનાત્મકતા અને ઉત્તમ ડિઝાઇનના નોંધપાત્ર ઉદાહરણો રજૂ થાય છે.",
    "call_to_action": "દિવસનું ડિઝાઇન શોધો",
    "date": "2026-11-08",
    "language": "gu",
    "image": "https://competition.adesignaward.com/design-of-the-day/today.png",
    "image_alt": "પુરસ્કાર વિજેતા સર્જનાત્મક ઉત્કૃષ્ટતા દર્શાવતું દિવસનું ફીચર્ડ ડિઝાઇન",
    "url": "https://designoftheday.org/gu/",
    "feature_url": "https://competition.adesignaward.com/design-of-the-day.html",
    "registry_url": "https://competition.adesignaward.com/designs-of-the-days.php",
    "embed_url": "https://designoftheday.org/gu/fichar/"
}

જાણવા જેવું

  • ઈમેજની આસપાસ લિંક રાખો, જેથી તમારા મુલાકાતીઓ સંપૂર્ણ ફીચર શોધી શકે.
  • હંમેશા ઉપર બતાવેલ ઈમેજ સરનામું વાપરો અને નકલ સાચવશો નહીં, જેથી તમારું પેજ અપડેટ રહે.
  • ઈમેજ રિસ્પોન્સિવ છે: તે ક્યારેય તેના કન્ટેનર કરતાં પહોળી થતી નથી.
  • મદદ જોઈએ છે અથવા કસ્ટમ ફોર્મેટ જોઈએ છે? કૃપા કરીને અમારો સંપર્ક કરો.

પ્રાયોજિત

એવોર્ડ વિજેતા ડિઝાઇન્સ શોધો

દિવસનું ડિઝાઇન અવતરણ

દિવસનું ડિઝાઇન અવતરણ

DesignAdage