Verwandte Themen

JungleBob
15.05.2021, 14:28
Wie bespreche ich mit einem Kunden, wie seine Webseite mit Wordpress aussehen soll?

Hi Leute,

ich habe zum ersten mal die Möglichkeit für einen Freund eine Webseite für sein Restaurant zu erstellen.

Ich benutze dafür Wordpress und habe auf seine Kosten den Divi Theme und auch ein Webhosting gekauft. Es ist auch soweit alles miteinander verknüpft.

Allerdings hat mein Kollege jetzt natürlich große Erwartungen von mir, da ich in einer kleinen Digitalagentur arbeite. Ich bin da als Grafik Designer tätig und habe in der Praxis nicht so viel Erfahrung mit Aufbau von Webseiten, bzw. mit Wordpress, Themes usw. Aber ich habe richtig Lust darauf, mir was neues anzueignen und es eventuell auch nebenbei zumachen.

Nur zu Info, ich kann meine Kollegen auf der Arbeit leider nicht nach Rat oder Unterstützung bitten, da ich es gerne für mich behalten möchte.

Jetzt geht es mir natürlich darum, dass ich bei Null anfangen muss und nicht genau weiß wie ich vorgehen soll. Jetzt muss ich erstmal herausfinden, wie mein Freund sich seine Webseite gerne vorstellt.

Ich denke, wenn ich eine Webseite bei Null aufbauen würde, könnte es zu Problemen führen, sobald ich etwas falsch mache und es wird mir sicher auch viel Zeit rauben. Also denke ich, dass ich ihm diverse Vorlagen vom Divi-Theme zeige und er dann entscheidet, welches ihm am besten gefällt. Ist das unprofessionell?

Ich hoffe ihr könnt mir folgen und versteht worauf ich hinaus will.

Über jede Hilfe würde ich mich freuen!

Webseite, WordPress, CMS, Webdesign, Webentwicklung, divi
3 Antworten
Abbasdas
04.11.2020, 23:36
CSS 3D-Würfel: Wie kann ich die Rückseite so wie die anderen Würfelseiten bewegen lassen?

Ich habe einen 3D-Würfel per CSS erstellt und würde ihm nun gerne eine 3D-Animation beim Hovern verleihen.

An sich komme ich auf das richtige Ergebnis, aber irgendwie verstehe ich die Rotation der Rückseite nicht und würde gerne wissen, wie ich sie so wie die anderen Würfelseiten bewegen lasse und nicht über diese komische Seitwärtsbewegung. Beziehungsweise ich möchte wissen, weswegen es bei rotateX überhaupt eine Seitwärtsbewegung durchführt.

Hier der Code:

HTML:

<div class="scene">
  <div class="cube">
    <div class="cube__face cube__face--front"></div>
    <div class="cube__face cube__face--back">back</div>
    <div class="cube__face cube__face--right">right</div>
    <div class="cube__face cube__face--left">left</div>
    <div class="cube__face cube__face--top">top</div>
    <div class="cube__face cube__face--bottom">bottom</div>
  </div>
</div>

CSS:

.scene {
  width: 200px;
  height: 200px;
  border: 1px solid #CCC;
  margin: 80px;
  perspective: 400px;
  transition-duration: 1s
}

.cube {
  transition-duration: 1s;
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transform: translateZ(-100px);
}

.scene:hover .cube {
  transform: translateZ(-10px);
}

.cube__face {
  ;
  border: 3px solid black;
  position: absolute;
  width: 200px;
  height: 200px;
  color: white;
  font-size: 2.5em;
  transform: scale(2.5);
  text-align: center;
  font-weight: bold;
  line-height: 200px;
  transform: perspective(500px) translateZ(250px)
}

.cube__face--front {
  transition-duration: 1s;
  transform: rotateY(0deg) translateZ(100px);
  background: url(Gesichr.png) hsla(214, 100%, 46%, 0.7);
  opacity: 0.5;
  background-size: cover;
}

.cube__face--right {
  transition-duration: 1s;
  transform: rotateY(90deg) translateZ(100px);
  background: hsla(99, 100%, 36%, 0.7);
}

.cube__face--back {
  transition-duration: 1s;
  transform: rotateY(180deg) translateZ(100px);
  background: hsla(63, 99%, 59%,0.7)
}

.cube__face--left {
  transition-duration: 1s;
  transform: rotateY(-90deg) translateZ(100px);
  background: hsla(10, 100%, 50%, 0.7)
}

.cube__face--top {
  transition-duration: 1s;
  transform: rotateX(90deg) translateZ(100px);
  background: hsla(181, 100%, 67%,0.8)
}

.cube__face--bottom {
  transition-duration: 1s;
  transform: rotateX(-90deg) translateZ(100px);
  background: hsla(38, 100%, 52%,0.7)
}

.scene:hover .cube__face--front {
  transform: rotatex(-30deg) translateZ(100px);
}

.scene:hover .cube__face--right {
  transform: rotateY(90deg) translateZ(100px) rotatez(-30deg);
}

.scene:hover .cube__face--back  {
  transform: rotateY(0deg) rotateX(150deg) translateZ(100px) rotate(-180deg);
}

.scene:hover .cube__face--left {
  transform: rotateY(-90deg) translateZ(100px) rotatez(30deg);
}

.scene:hover .cube__face--top  {
  transform: rotateX(60deg) translateZ(100px);
}

.scene:hover .cube__face--bottom {
  transform: rotateX(-120deg) translateZ(100px);
}
Programm, HTML, 3D, programmieren, CSS, Code, Webdesign
1 Antwort
AnonymousX63
19.08.2020, 14:48
Seltsamer Codierung?

Könnt ihr mir sagen was dieser Code heißen soll und könnt ihr ihn für mich lesen? Ich danke euch schon mal in voraus hier der Code.

1000) {
    r = r.substring(0, r.length - 1);
}
return r;
}());
}
var ftDomain = (window == top) ? "" : (function() {
    var d = document.referrer,
        h = (d) ? d.match("(?::q/q/)+([qw-]+(q.[qw-]+)+)(q/)?".replace(/q/g, decodeURIComponent("%" + "5C")))[1] : "";
    return (h && h != location.host) ? "&ft_ifb=1&ft_domain=" + encodeURIComponent(h) : "";
}());
var ftV_4678289 = {
        pID: "4678289",
        width: "300",
        height: "600",
        params: {
            ftx: window.ftX,
            fty: window.ftY,
            ftadz: window.ftZ,
            ftscw: window.ftContent,
            ft_custom: window.ftCustom,
            ft_id: window.ftID || "",
            ft_idEnabled: window.ftIDEnabled || "",
            ftOBA: window.ftOBA,
            ft_domain: ((ftDomain || "")
                .match(RegExp("&ft_domain=([^&$]+)", "i")) || ["", ""])[1],
            ft_ifb: ((ftDomain || "")
                .match(RegExp("&ft_ifb=([^&$]+)", "i")) || ["", ""])[1],
            ft_agentEnv: window.mraid || window.ormma ? "1" : "0",
            ft_referrer: encodeURIComponent(window.ft_referrer),
            cachebuster: window.ftRandom
        },
        winVars: {
            ftClick_4678289: window.ftClick_4678289,
            ftExpTrack_4678289: window.ftExpTrack_4678289,
            ft300x600_OOBclickTrack: window.ft300x600_OOBclickTrack
        },
        DTimeout: 1E3,
        GTimeout: 1E3
    },
    ◇ftPProc = function(d) {
        var c = this;
        d = JSON.parse(JSON.stringify(d));
        var☆ f = [],
            l = function(a, b) {
                b = "undefined" === typeof b || isNaN(b) ? 1 : parseInt(b, 10);
                a = a || "";
                for (var e = 0 <= b ? b : 0; e--;) a = encodeURIComponent(a);
                return

LÖSE DEN CODE X a
}, h = function(a) {
        a = a.constructor == Array ? a : [];
        for (var b = 0; b

Dieser Code heißt anscheinend Code X oder was auch immer. Danke schon mal in voraus.

AnonymousX63

PC, Internet, IT, programmieren, JavaScript, Codierung, Webdesign
1 Antwort
KnowHow1001
15.05.2020, 14:45
Mit Bildern
Mit Links
Basic HTML Kästchen positionieren?

Hey.

Also ich weiß, dass es bei HTML divs gibt die sozusagen Blöcke sind die man mit Eigenschaften versehen kann via CSS.

nun wollte ich ein einfaches web layout gestalten aber scheitere daran, dass ich divisions einmal rechtsbündig und einmal linksbündig zentriere mit nem abstand dazwischen

wie ihr sehen könnt habe ich es dann zusammen gepfuscht bekommen sodass die abstände halbwegs passen.

gibt es da einen besseren zugang ? Bitte nur Tipps will selbst auf die Lösung kommen :)

bin auch schon am Überlegen den Code komplett neu zu schreiben :)

habe euch ein bild vom layout gemacht. dachte eigentlich ich mache für jedes kästchen eine eigene div umgeben von einer master div welche die komplette breite bestimmen soll.

und darin dann eben die einzelnen divs entweder zentrieren oder rechts / links

nur weil ich eben 2 kästchen in einer reihe habe dachte ich daran es mit einem table zu lösen und in der tr dann eben 2x TD damit die divs nebeneinander sein können

nicht geklappt. hab eigentlich schon so ziemlich alles probiert. divs hinzufügen, entfernen und über css habe ich versucht einzelne elemente zu manipulieren etc.

haut leider nicht hin.

Was meint ihr zu den bilder crop und größen veränderung. ich weiß man könnte es mit photoshop auf die entsprechende größé trimmen aber ich wollte es mit html/css schaffen :)

habe auch versucht den code Schön zu machen als "Lesbar", was hält ihr davon?

HTML

http://pastie.org/p/2vfSJIRfb5QSHBNQciATWO

Header CSS

http://pastie.org/p/6wEHhhZQWKYwwfC2RSxof3

Mainstyle CSS

http://pastie.org/p/5gFxKIEBpI0f5dlimjen9X

Footer CSS

http://pastie.org/p/5oUkLA58gIJ8cgWjw6gGTq

lg

Bild zum Beitrag
Computer, HTML, programmieren, CSS, Webdesign
3 Antworten

Meistgelesene Beiträge zum Thema Webdesign
Mehr meistgelesene Fragen zu Webdesign