Hej
Hvorfor ser mine Cookies warnings forskellige ud....?
1). Ser her ...1
2). Og se så her ...2
Jeg bruger Cookie Notice for GDPR plugin
Hvordan får jeg dem ens som nr. 2
App Web
Hej
Hvorfor ser mine Cookies warnings forskellige ud....?
1). Ser her ...1
2). Og se så her ...2
Jeg bruger Cookie Notice for GDPR plugin
Hvordan får jeg dem ens som nr. 2
Er det samme WP installation?
I indstillinger for pluginen har du valgt "bootstrap" som knapstil.
Hvad sker der hvis du vælger WP?
Personligt synes jeg knappen i "1" er pænere men farven i "2" er flot.
Kiggede på siderne med webværktøjet (Crtl+Skift+i)
du kan evt prøve at sætte følgende ind i Ekstra CSS i kontrolpanelet/udseende/tilpas
.cn-button.bootstrap {
background-color: #640000;
background-image: linear-gradient(to bottom,#640000,#440000);
}
Hej Boldt
vi er helt enige, jeg kan også bedst lide knap 1 men med farve #640000
Hvis jeg vælger WP så bliver de blå knapper hvide
Hvis jeg bruger din CSS - ser det ok ud
Men kan jeg få alle knapperne til at være som nr. 1
Ja, men det kræver lidt CSS-gymnastik.
Det er derfor jeg henviser til Webudviklerværktøjet (Crtl+Skift+i i chrome og firefox). Med dette værktøj kan du vælge elementer og se CSS, hvordan dine knapper er opbygget.
Ved at kopiere indholdet fra den ønskede knap over i det dit CSS kan du få knappen som du vil have den.
Knappen med runde hjørner defineres af følgende:
.cn-button.wp-default {
font-family: sans-serif;
line-height: 18px;
padding: 2px 12px;
background: linear-gradient(to bottom,#FEFEFE,#F4F4F4) repeat scroll 0 0 #F3F3F3;
border-color: #BBB;
color: #333;
text-shadow: 0 1px 0 #FFF;
-moz-box-sizing: border-box;
border-radius: 3px 3px 3px 3px;
border-style: solid;
border-width: 1px;
cursor: pointer;
display: inline-block;
font-size: 12px;
font-style: normal;
text-decoration: none;
white-space: nowrap;
outline: none;
}
.cn-button.wp-default, .cn-button.wp-default:hover, .cn-button.bootstrap, .cn-button.bootstrap:hover {
box-shadow: none;
text-decoration: none;
}
woocommerce knapper er defineret i SCC under:
.site-top-bar, .site-header .site-top-bar .site-container, .site-header .site-top-bar-left, .site-header .site-top-bar-right, #back-to-top, #comments .form-submit #submit, .no-results-btn, .slider-container.default .prev.square-solid, .slider-container.default .next.square-solid, button, a.button, .widget-area .widget h2.widget-title::after, .widget-area .widget a.button, .tropicana-page-builders-use-theme-styles .widget_sow-button .ow-button-base a, input[type="button"], input[type="reset"], input[type="submit"], hr, ul.sections > li hr.divider, .main-navigation li:hover .indicator, .main-navigation li.current_page_item .indicator, .main-navigation li.current-menu-item .indicator, .main-navigation li.current-menu-parent .indicator, .main-navigation li.current-menu-ancestor .indicator, .main-navigation li.current_page_parent .indicator, .main-navigation .search-button:hover .indicator, .site-header-right .header-menu-button, .side-aligned-social-links .social-links li, .site-footer-widgets .site-container .widgets-container .divider, .woocommerce ul.products li.product a.add_to_cart_button, .woocommerce-page ul.products li.product a.add_to_cart_button, .woocommerce ul.products li.product a.button.product_type_simple, .woocommerce-page ul.products li.product a.button.product_type_simple, .woocommerce button.button:disabled, .woocommerce button.button:disabled[disabled], .woocommerce button.button:disabled:hover, .woocommerce button.button:disabled[disabled]:hover, .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled[disabled], .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled:hover, .woocommerce button.button.alt:disabled[disabled], .woocommerce button.button.alt:disabled[disabled]:hover, .woocommerce button.button, .woocommerce button.button.alt, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover, .woocommerce button.button, .woocommerce button.button.alt, .woocommerce a.button.alt, .woocommerce-page button.button.alt, .woocommerce input.button.alt, .woocommerce-page #content input.button.alt, .woocommerce .cart-collaterals .shipping_calculator .button, .woocommerce-page .cart-collaterals .shipping_calculator .button, .woocommerce a.button, .woocommerce-page a.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page input.button, .woocommerce #review_form #respond .form-submit input, .woocommerce-page #review_form #respond .form-submit input, .wpcf7-submit, div.wpforms-container form.wpforms-form input[type="submit"], div.wpforms-container form.wpforms-form button[type="submit"], div.wpforms-container form.wpforms-form .wpforms-page-button, .site-footer-bottom-bar, .tropicana-page-builders-use-theme-styles .testimonials .sow-slider-base .sow-slide-nav {
background-color: #640000;
}
#back-to-top .hover, .main-navigation button:hover, #comments .form-submit #submit:hover, .no-results-btn:hover, .slider-container.default .prev.square-solid:hover, .slider-container.default .next.square-solid:hover, button:hover, a.button:hover, .widget-area .widget a.button:hover, .tropicana-page-builders-use-theme-styles .widget_sow-button .ow-button-base a.ow-button-hover:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .side-aligned-social-links .social-links li:hover, .select2-container--default .select2-results__option--highlighted[aria-selected], .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce .cart-collaterals .shipping_calculator .button, .woocommerce-page .cart-collaterals .shipping_calculator .button, .woocommerce a.button:hover, .woocommerce-page a.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page input.button:hover, .woocommerce ul.products li.product a.add_to_cart_button:hover, .woocommerce-page ul.products li.product a.add_to_cart_button:hover, .woocommerce ul.products li.product a.button.product_type_simple:hover, .woocommerce-page ul.products li.product a.button.product_type_simple:hover, .woocommerce button.button:hover, .woocommerce button.button.alt:hover, .woocommerce a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce #review_form #respond .form-submit input:hover, .woocommerce-page #review_form #respond .form-submit input:hover, .wpcf7-submit:hover, div.wpforms-container form.wpforms-form input[type="submit"]:hover, div.wpforms-container form.wpforms-form button[type="submit"]:hover, div.wpforms-container form.wpforms-form .wpforms-page-button:hover, .tropicana-page-builders-use-theme-styles .testimonials .sow-slider-base .sow-slide-nav:hover
{
background-color: #7f9430;
}
Det er vel temaet der som udgangspunkt fortæler hvordan knapper skal se ud.
Men som tidligere angivet, kan man tilføje ekstra CSS og det er no den eneste vej frem.
Hej Bolt
Super tak for dit respons.
Jeg har og bruger faktisk og Crome
(men jeg syntes som du skriver at det så voldsomt ud, så jeg tænkte det var ikke korrekt).
Jeg prøver at finde på noget.....
Hej Bolt
Hmmm
Jeg har lige prøvet at kopiere "Knappen med runde hjørner defineres af følgende:"
til min css
Det hjælper IKKE, desværre
Når jeg i webudviklerværktøjet kopierer indholdet fra den ene type knap (1) over i den anden (2) ændres alle knapper.
Det er indholdet af CSS som skal kopieres ikke hele teksten. dvs kun det som står mellem { }
Jeg så godt, at knappen er blevet hvid. Så det er fordi du har ændret fra bootstrap til WP-default. det kan også ses i CSS hvor .cn-button.bootstrap nu er .cn-button.wp-default
Jeg ved ikke præcis, hvad du har gjort, eller hvor meget du ved om CSS. Det er i CSS at knapperne defineres og det er i Ekstra CSS at ændringer skal sættes ind, hvis ikke d sættes i et undertema.
Hej Boldt
Jeg læste det hele igennem et par gange og fandt så løsningen.
tak for dine svar mm.
Hej Boldt
Nu mangler jeg kun mobil-versionen, den ser "mærkelig" ud.
Har du nogle gode ideer...............?
Mobil-version? hvilken mobil?
Jeg bruger Webudvikler-Respnsivt design i Firefox/Chrome (Crtl+Skift+m) til at simulere mobilvisning.
Er dit tema beregnet til mobil-visning?
Har du prøvet en AMP-plugin? f.eks AMP for WP – Accelerated Mobile Pages
Hej Boldt
Jeg testede det lige på en Iphone - har også prøvet (Crtl+Skift+m)
Temaet er beregnet til mobil i følge udvikleren.
Har ikke prøvet AMP - det gør jeg lige - TAK
Hej Boldt
Så erAMP prøvet, det hjalp lidt på det.
Det bliver ikke bedre i denne omgang
Super - Tak
Alternativet er at skrive et CSS specielt til mobil-visning.
Hvis jeg skulle gøre det ville jeg nok oprette et undertema hvor CSS'en kun beskriver mobile enheder. (Men jeg er doven anlagt så jeg bruger jo kun standardtema twenty-XXXX hvor responsive formater er defineret.
Det er for kompliceret at komme ind på præcis hvordan man arbejder med responsive enheder men, her er nogle links som forklare lidt:
Responsive Design Tutorial
Responsive Web Design - Media Queries
Du skal være logget ind for at skrive.