Editieren von dreispaltigem Block

Allgemeine Fragen
Peter_Eisenburger
Mitglied (Level 3)
Mitglied (Level 3)
Beiträge: 24
Registriert: Sa 23. Jan 2021, 13:02

Editieren von dreispaltigem Block

Ungelesener Beitrag von Peter_Eisenburger »

Das ist jetzt wirklich eine andere Welt für mich... Ich bin es nicht nur von NetObjects, sondern auch von Grafik- und DTP-Programmen her gewöhnt, pixelgenaue Kontrolle über das Layout zu haben. Und in Mobirise ist alles template- und style-basiert. Es gibt ja nicht mal in-place-editing von Textformaten.

Wie mache ich zum Bespiel Folgendes:

Ich habe einen Block mit drei Spalten, z. B. "Features" oder "News", jeweils Bild und darunter Text. Ich will den mehrmals verwenden, aber in der letzten Reihe, die diese Blöcke dann bilden, habe ich nur zwei "Produkte". Lässt sich die dritte Spalte dieses Blocks irgendwie ausschalten oder verbergen? Habe es mit weißem Text probiert (ihr werdet lachen...), aber dann wurde der Text des ganzen Blocks weiß.

Mir ist klar, dass es Blöcke gibt, die nur zwei Spalten haben, aber die sind dann enstsprechend auch breiter.

Geht sowas vielleicht mit dem Code Editor?
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

Hallo Peter,

ja - so ist Mobirise aufgebaut. Das hat natürlich auch enorme Vorteile, denn mit "pixelgenau" ist das bei responsiven Layouts meist gar nicht möglich.

Um Dir bei dem Problem mit diesem Block helfen zu können, müsstest Du schon ganz genaue Angaben dazu machen, Mobirise hat Tausende von Blöcken in Dutzenden von Themen - wie soll man das sonst erraten?!

Also bitte das Thema benennen und den Namen vom Block inklusive der Kategorie und am besten noch einen Screenshot dazu.

Meist kann man die Anzahl der Elemente an den Zahnrad-Einstellungen bestimmen, wenn nicht - kann man auch sehr oft an den Mobirise-Parametern im "Code Editor" ändern. Noch einfacher ist es natürlich einen Block zu suchen, der Deinen Erwartungen besser entspricht. Alle Blöcke des Standard-Themas und aller "M4" Themen sind untereinander kombinierbar und kompatibel.
Peter_Eisenburger
Mitglied (Level 3)
Mitglied (Level 3)
Beiträge: 24
Registriert: Sa 23. Jan 2021, 13:02

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Peter_Eisenburger »

Hi Tommy,

ja ist mir schon klar, dass das eine andere Technologie ist... Leider.

Wenn ich den Block auf zwei Spalten verändere, werden diese breiter, da der Block immer die ganze Bildschirmbreite einnehmen soll oder muss.

Ich häng mal ein paar Screenshots an, dann siehst du, was ich meine. Bei der dritten Datei habe ich einfach die dritte Spalte mit einem weißen Rechteck verdeckt.

Beste Grüße

Peter
Dateianhänge
nof_drei_und_zwei_spalten.jpg
mobi_drei_spalten.jpg
zwei_spalten_gewuenscht.jpg
zwei_spalten_unerwuenscht.jpg
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

Moin,
Peter_Eisenburger hat geschrieben: Di 6. Apr 2021, 19:00 ja ist mir schon klar, dass das eine andere Technologie ist... Leider.
Na ja - "leider" - :confused: - leider hat NOF diese Technologie nicht geschafft zu erstellen und ist daher auch pleite gegangen :(


... ja - aber so ganz wirklich kann ich Dein Problem jetzt noch nicht erkennen.

Da NOF ja nicht responsive ist (oberster Screenshots von Dir), könnte man dort eben diesen freien Platz lassen, bei einer responsiven (am Display angepassten) Software wie Mobirise, würde das weiße Rechteck unter die beiden mit den Karten positioniert werden und es gäbe am Handy eine riesen Lücke.

Man kann doch z.B. an diesem Block, der ja offensichtlich aus dem Standard-Thema "Mobirise 5" stammt, die Anzahl der Spalten an den Block-Werkzeugen (Zahnrad) einstellen:

Spalten.jpg

... z.B. auf 2 Spalten und dann gegebenenfalls auch den Schalter bei "Full Width" (Ganze Breite) ausschalten. Die Breite der Darstellung könnte man auch noch im "Code Editor" anpassen:

Breite.JPG

oder Du klickst mal auf die schwarze Kachel "More Images & Sliders" und findest einen Haufen anderer Bild-Blöcke aus anderen Themen, die z.B. auch nur 2 Bilder darstellen:

Image und Video Blocks.JPG


Lies Dir mal, für ein besseres Verständnis, auch diese Bootstrap-Seite bezüglich des Grid-Systems durch, mit dem man auch die Breite einer Seite definiert:

http://holdirbootstrap.de/css/


Gucke Dir vielleicht auch mal dieses alte Video an (noch aus "Mobirise 3") - da geht es auch um die Breite eines Blocks:




P.S.:

hast Du denn die Rechte an diesem Kartenmaterial? Du weißt schon, dass jegliche Landkarten, egal ob alt oder neu, einen Copyright-Schutz haben (schon von dem Verlag der diese gedruckt hat) und nicht öffentlich verwendet werden dürfen.
Benutzeravatar
Rancher
Moderator
Moderator
Beiträge: 466
Registriert: Di 8. Dez 2020, 18:37
Wohnort: Elsass

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Rancher »

Bei der responsiven Darstellung muss man sich davon lösen, dass die User, die Deine Website betrachten, genau das sehen, was Du im Moment an Deinem Rechner siehst. Du musst Dir im Klaren darüber sein, dass sowieso, je nach Bildschirmgröße, der eine zwei, der andere drei Bilder nebeneinander oder alle untereinander sieht. Das, was Du mit der Weißabdeckung machst, ist, wie Tommy schon angemerkt hat, eher kontraproduktiv.

Verändere beim Arbeiten auch schon mal die Größe des Browserfensters, nutze die Handyansicht von Mobirise und betrachte Dein Ergebnis nach Publizierung auch von anderen Geräten aus, damit Du ein Gefühl bekommst. Es gibt im Netz auch verschiedene Angebote, um diverse Endgeräte zu simulieren.

Man kann mit Hilfe des Code-Editors schon die Spaltenbreite beeinflussen, oder bestimmen, ob die ganze Bildschirmbreite ausgefüllt werden soll. Nur wird immer irgendwann die Umbruchstelle kommen, vom Endbildschirm beeinflusst, wo Du eben nicht mehr 2 oder 3 Spalten nebeneinander hast.
Wenn Dein Pferd tot ist, steig ab.
Peter_Eisenburger
Mitglied (Level 3)
Mitglied (Level 3)
Beiträge: 24
Registriert: Sa 23. Jan 2021, 13:02

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Peter_Eisenburger »

Tommy, ich will, dass es mit Mobirise auf dem Desktop so aussieht wie mit NOF, dass also in der zweiten Kartenreihe die Lücke da ist - weil ich für dieses Thema eben nur zwei Karten habe. Diese beiden Karten (die Previews) sollen aber dieselbe Breite haben wie die anderen. Und sie sollen linksbündig sein.

Es stimmt natürlich, dass dann auf dem Smartphone-Bildschirm eine weiße Lücke da wäre, wenn ich diese irgendwie erzeugen könnte. Das habe ich nicht bedacht. Ich bin geistig einfach in der Welt der pixelgenauen Plazierung...

Au dem Video seiht man ja auch zum Beispiel an der Laufweite des Textes, welche unerwünschte Folgen solche Eingriffe haben können.

Ich habe noch zwei Fragen. Auf dem Video ist der Code-Editor in das Kontext-Menü integriert, mit diesem Symbol </>. Wie kriegt man ihn dorthin? Gekauft habe ich ihn bei der Erstbestellung gleich mit.

Auf dem Video sieht man ebenfalls oben auf dem Bildschirm drei Bildschirmgrößen. Ich habe nur zwei Möglichkeiten (durch Toggeln mit an selber Stelle abwechselnd dargestellten zwei Größen).

Danke, Rancher, auch für deine Hinweise. Ja, ich weiß. Ich sehe bei den Besuchern meiner Websites zum Beispiel auch viele Tablets, und auch viele sehr hochauflösende Bildschirme, wie man sie im wissenschaftlichen oder im Bereich des Grafik Designs findet.

Tommy, du denkst aber auch an alles :) Die lizenzrechtlichen Fragen habe ich in dem Fall natürlich mit den entsprechenden Staatsarchiven abgeklärt, so wie ich diesen Fragen immer besondere Aufmerksamkeit schenke, alleine schon aus Selbstschutz.
Benutzeravatar
Volker
Moderator
Moderator
Beiträge: 828
Registriert: Sa 12. Dez 2020, 22:35
Wohnort: Wildberg
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Volker »

Geh mal in das Menü Konto und dort in die App Einstellungen.
Da kannst Du alle Schalter mal an machen - bis auf den Github. Dort kannst auch auf Deutsch stellen.
Gruß Volker
Peter_Eisenburger
Mitglied (Level 3)
Mitglied (Level 3)
Beiträge: 24
Registriert: Sa 23. Jan 2021, 13:02

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Peter_Eisenburger »

danke, Volker. Englisch ist bei Software sowas wie meine Muttersprache.
den Code Editor unter den ganzen Themes zu verstecken, war nicht so eine gute Idee vom Hersteller...
wenn ich euch nicht hätte :)
Benutzeravatar
Volker
Moderator
Moderator
Beiträge: 828
Registriert: Sa 12. Dez 2020, 22:35
Wohnort: Wildberg
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Volker »

Es gibt noch einen Trick, den ich auch öfter mal mache wenn ich was spezielles einbauen möchte.

Ich nehme mein altes Programm Dreamweaver und erstelle mir einfach eine Tabelle, wie ich sie gerne hätte.
Die kopiere ich mir und füge sie in einem HTML Block ein. Ist nicht die beste Lösung wird Tommy jetzt sagen, aber das klappt ganz gut.

Deine Bilder könnte man so auf jeden Fall darstellen. Müsste ja auch mit dem HTML Code von NOF so gehen.
Das ganze könnte man ja per CSS responsive gestalten.
Gruß Volker
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

na eigentlich geht das doch auch total einfach mit dem "Code Editor" zu ändern.

Ich habe z.B. hier 2 x die gleichen Bilder-Blöcke übereinander gepackt und am unteren Block, anstelle von 4 Bildern, eben nur 3 Bilder - also das letzte entfernt:

https://www.mobirise-tutorials.com/Test ... ntent-edit

... also dieses DIV entfernt (im Screenshot vom Code-Editor markiert):

Code: Alles auswählen

<div class="image-wrapper">
    <img src="file:///C:/Users/User/AppData/Local/Mobirise.com/Mobirise/DeineEmail/addons/artm4/components/_images/features/features1.jpg" alt="Mobirise">
    <p class="mbr-text mbr-fonts-style mt-2 align-left" mbr-theme-style="display-4" mbr-if="showDescription" data-app-selector=".mbr-text">Graphic Design</p>
</div>

Eine Grafik entfernt.JPG

Block editiert.JPG


Natürlich könnte man auch ebenso gut 3 Bilder wählen und dann eines entfernen oder auch zwei entfernen.

... dann klappt das auch am Handy und gibt keine weiße Lücke.
Peter_Eisenburger
Mitglied (Level 3)
Mitglied (Level 3)
Beiträge: 24
Registriert: Sa 23. Jan 2021, 13:02

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Peter_Eisenburger »

genau das habe ich gemeint.
danke :)
comunio23
Mitglied (Level 2)
Mitglied (Level 2)
Beiträge: 11
Registriert: Mi 10. Mär 2021, 08:25

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von comunio23 »

Guten Morgen,
ich hoffe meine Frage passt hier thematisch hin.

Ich hab wie auch oben schon von euch besprochen, einen dreispaltigen Blog "News".
Wenn der Nutzer auf die "erste" Meldung ganz links klickt, gelangt er auf die separate "News-Seite" und kann den Beitrag vollständig lesen. Das habe ich per Verlinkung gelöst.
Wenn der Nutzer auf die mittlere Meldung klickt, gelangt er auf der "News-Seite" in den Beitrag, der sich unter dem Beitrag des aktuellerem Beitrag befindet usw.

Wenn ich jetzt einen aktuellen News-Eintrag auf der Startseite im News-Blog erstelle, muss ich den linken Beitrag in die Mitte schieben und den in der Mitte nach rechts und der ganz recht wandert raus. Dann muss ich wiederum die Verlinkungen der einzelnen drei News-Blogs ändern. Das ist alles etwas kompliziert und es gibt sicherlich eine einfachere Lösung... aber welche? Gibt es Ideen?
Hier der Link um ein besseres Bild zu erhalten. Danke.
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

Moin,

Dein Link fehlt leider - Du kannst Deinen Beitrag 1 Stunde am Bleistift-Symbol editieren, falls Du den noch rein kopieren willst.

ja, da musst Du ja bei jeder neuen Meldung alles neu machen. Das ist schon umständlich und so ein Block ist dafür auch nicht gedacht oder geeignet, bzw. Mobirise hat so einen Block nicht.

Da würde sich wohl eher ein "Timeline" Block anbieten, den Du auch von unten nach oben "drehen" kannst und dann schmeißt Du die abgelaufenen Meldungen raus.

https://www.mobirise-tutorials.com/Test ... l#Timeline

... oder vielleicht auch eine Tabelle, wie ich sie hier für einige meiner Tutorials verwende. Sie hat auch eine eigene Suchfunktion und man kann diese vorsortieren, also dann z.B. immer den neuesten Beitrag nach oben stellen.

https://mobirise-tutorials.com/Tutorial-Links/

Es gibt natürlich auch eigene Anwendungen, die Du in Mobirise einbauen könntest, wie dieses "News" Skript von unserem Werner-Zenk.de:

https://www.mobirise-tutorials.com/News/
Benutzeravatar
Rancher
Moderator
Moderator
Beiträge: 466
Registriert: Di 8. Dez 2020, 18:37
Wohnort: Elsass

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Rancher »

Du könntest das Ganze auch übereinander statt nebeneinander machen.

Was Du da machst, scheint mir ein bisschen kompliziert.

Ich habe das mal ganz popelig gelöst: Einen User-Block abgespeichert (kann Textblock sein oder Text mit Bild bspw.), den ich immer wieder oben über die vorherigen Blöcke einfüge und den Inhalt mit den News abändere. So schieben sich die älteren Nachrichten immer weiter nach unten, ganz alte kann man einfach rauslöschen.
Wenn Dein Pferd tot ist, steig ab.
Benutzeravatar
Andyneu
Moderator
Moderator
Beiträge: 67
Registriert: Mi 9. Dez 2020, 16:40
Wohnort: Hoope
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Andyneu »

Hallo
@Peter
Beim Erstellen einer neuen Seite finde ich es ganz Hilfreich mit der Größe für Handys anzufangen.
1. In vielen Fällen ist es so, dass man für die mobile Ansicht nicht alles zeigt, was nachher in der Desktopansicht zu sehen ist.
2. zweitens ist die Darstellung die leichteste, da in der Regel die einzelnen Blöcke/ Elemente untereinander angeordnet sind.

Dann weiter machen mit der Ansicht für Tablets und kleine Laptops hier wird es meistens zwei- event. dreispaltig und hier kommt eventuell auch schon mehr Inhalt rein.

Danach gestaltest du dann die Ansicht für große Displays also Desktop und Fernseher. Hier hast du dann die Möglichkeit ein breites Design zu wählen. Generell wird hier auch der meiste Content rein gepackt.

Das ganze ist natürlich nicht zwingend man kann es auch genau umgekehrt machen, nur manchmal entstehen dann in der Mobilenansicht Designprobleme, wie z.B. größere Lücken/Absätze oder Textüberschriften die nicht in eine Zeile passen oder Bilder wo der Bildausschnitt nicht mehr passt etc., die man dann nachträglich lösen muss.
Da muss aber jeder für sich den besten Weg und Workflow finden.

Ist nur so ein Gedankenanstoss.

Für responsives Design ist es wichtig das Bootstrap Framework und das moderne CSS3 zu verstehen. Insbesondere solltest du dir die CSS Flexbox - Anweisungen angucken.

https://www.on-design.de/tutor/html5_cs ... exbox.html
Gruß Andy
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

Moin,

aber Mobirise macht doch in fast allen Böcken nichts anderes als diese Flex-Anweisungen zu verwenden, da muss man doch nichts Eigenes machen ...

... und Bootstrap baut darauf doch auf und Mobirise basiert auf Bootstrap.

Ich glaube es ging "comunio23" doch auch gar nicht um das Design, sondern eher die Links bei neuen News komfortabel neu zu setzen und nicht immer alle 3 Cards neu verlinken zu müssen.

Bei einer "Timeline" würden die älteren News dann unten raus rutschen und die neuen immer ganz oben stehen.

Im Prinzip sollen doch lediglich die neusten Nachrichten immer nur oben stehen und die älteren entsprechend nach unten rutschen, bzw. bei ihm stehen jetzt die neuesten Nachrichten im linken Bereich des Block mit den drei Karten und in der Mitte die Nachrichten davor und rechts wieder die davor.

Bei neuen News muss man eben auch neue Beiträge schreiben. Es sollen eben nur nicht immer alle 3 Cards geändert werden müssen.

Deswegen wäre es sicherlich günstiger für so etwas eine Datenbank-Anwendung, wie mein Beispiel vom "Nachrichten" Skript, zu nehmen und somit nicht bei jeder Änderung Mobirise bearbeiten zu müssen, sondern lediglich über eine solche externe Anwendung das schnell "online" einzutragen, eben wie bei einem CMS ("Content-Management-System", deutsch "Inhaltsverwaltungssystem").

Dort hat man dann einen Editor, den man online am Browser aufruft, und kann seine News dort sehr schnell und sortiert nach Kategorien und Zeit eintragen, bearbeiten, löschen, Links setzen, Bilder hochladen und vieles mehr.

Weiterhin können auch Nachrichten von anderen, dazu autorisierten Personen, eingetragen oder bearbeitet werden. Jede Person kann dann nur die eigenen Nachrichten bearbeiten, nur der Administrator hat Zugang zu allen Nachrichten.

So sieht dieser Editor aus:

Nachrichten-Editor.JPG
Benutzeravatar
dettec61
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 189
Registriert: Di 30. Mär 2021, 09:41
Wohnort: Siegerland

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von dettec61 »

Hallöle,
für beide hier gibt es doch Standard mobirise-5 Blöcke oder verstehe ich das falsch?

@Comunio23
Bei deinen News Blocks kannst du z.B. einen Feature Block nehmen. Da kannst du deine News verschieben inkl. der Links. Der geht auch über mehrere Zeilen... Bei einer neuen News machst du einfach an letzter Stelle eine neue News und schiebst so lange wie es dir passt.

@Peter_Eisenburger
Auch für dich wäre so ein Feature Block vielleicht der Ausweg aus deinem Dilemma. Du nimmst diesen Block, stellst ihn auf 3 Spalten und erweiterst ihn dann um 2 Einträge.
Somit hast du oben 3 und darunter 2 Einträge die Spaltenmäßig genau so aussehen wie bei NOF.
Grüssle
Detlev
Benutzeravatar
Volker
Moderator
Moderator
Beiträge: 828
Registriert: Sa 12. Dez 2020, 22:35
Wohnort: Wildberg
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Volker »

In der Design Blocks Galerie gibt es einen Blog Block ;)

Sieht so aus:
blog.png
Eventuell hilft Euch ja sowas ;)
Gruß Volker
LeKristin
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 2
Registriert: Sa 3. Jun 2023, 23:45

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von LeKristin »

Hallo zusammen,
ich bin auf der Suche nach diesem Blog Block, kann ihn aber beim besten Willen nicht finden.
Kann mich jemand bitte navigieren? Oder vielleicht gibt es diesen Blog Block auch gar nicht mehr?
Ich muss dazu sagen, dass ich absoluter Mobirise-Neuling bin, erst heute hab ich es entdeckt :freude:
Mein Ziel: meinen Wordpress-Blog mit Mobirise neu aufziehen, meint ihr das geht überhaupt? Hat jemand Erfahrungen mit dem Bloggen mittels Mobirise?
Viele Grüße
Kristin
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Editieren von dreispaltigem Block

Ungelesener Beitrag von Tommy Herrmann »

Hallo Kristin,

und willkommen bei uns im Forum :hallo:

Mobirise ist im Gegensatz zu WordPress eine Offlinesoftware und kein CMS.

Zum Bloggen benötigt man eine Datenbank. Das geht mit Mobirise nicht.

Volker hat geschrieben: Fr 21. Mai 2021, 13:27 In der Design Blocks Galerie gibt es einen Blog Block ;)
Ich habe keine Ahnung was Volker in seinem Beitrag (oben) mit diesem Blog Block überhaupt meint. Ich kenne auch diesen Block im Screenshot überhaupt nicht. Könnte sein, dass der von einem Drittanbieter angeboten wurde. Es ist aber dennoch sicherlich nur ein Design-Block wie jeder andere und nichts zum Bloggen.


Du kannst zwar im Prinzip jede denkbare Anwendung letztendlich in Mobirise auch einbauen - also auch Datenbanken und PHP-Anwendungen - das ist aber so nicht konzipiert. Mobirise erstellt statische Webseiten, die aber nicht interaktiv bedienbar sind wie ein Content Management System (CMS).

WordPress ist zum Bloggen entwickelt worden und eigentlich nicht zum Erstellen von Webseiten.

Genau dort liegt der Unterschied.
Antworten

Wer ist online?

Mitglieder in diesem Forum: Ahrefs [Bot] und 23 Gäste